我正在尝试做一些非常简单的事情。 我有一张带有翻转的图像。单击时, onmouseout 和 onmouseover 事件将被删除,并且图像将被交换。到目前为止我已经明白了,但现在我想添加一些东西,以便当再次单击它时,一切都会返回到原始状态(再次交换图像并激活 onmouseover 和 onmouseout。
这是我到目前为止得到的代码:
<a href="#"
onMouseOut="MM_swapImgRestore();
"
onMouseOver="MM_swapImage('image','','images/image-2.jpg',1)"
onClick="
MM_swapImage('image','','images/image-3.jpg',1);
this.onmouseover=null;
this.onmouseout=null;
"
>
<img name="image" src="images/image-1.jpg" id="rond9"></a>
最佳答案
对于我相当简单的解决方案,我会添加一个标志并在触发 mouseover 和 mouseout 事件之前检查它,因为它消除了附加和分离事件的不必要的负担。
即:
<script>var myFlag=true;</script>
<a href="#"
onMouseOut="if(myFlag === true){MM_swapImgRestore();}"
onMouseOver="if(myFlag === true){MM_swapImage('image','','images/image-2.jpg',1);}"
onClick="MM_swapImage('image','','images/image-3.jpg',1);
myFlag = !myFlag;"
>
<img name="image" src="images/image-1.jpg" id="rond9"></a>
关于javascript - 管理鼠标悬停和鼠标单击事件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5153405/