Javascript 对li标记重复onmouseover/onmouseout调用
我有以下代码。（您可以将其复制到文件中，以便在Firefox中进行调试，并在Firebug的控制台选项卡中查看输出） 当我将Javascript 对li标记重复onmouseover/onmouseout调用,javascript,onmouseover,onmouseout,Javascript,Onmouseover,Onmouseout,我有以下代码。（您可以将其复制到文件中，以便在Firefox中进行调试，并在Firebug的控制台选项卡中查看输出） 当我将onmouseoverenvent添加到li标记中，并将鼠标移动到li区域时，控制台信息会显示出来 问题是当我将鼠标从图像（谷歌徽标）移动到它下面的文本时，会打印出多个信息。既然我没有离开li区域，为什么会触发onmouseout事件 在这种情况下，我应该如何防止触发onmouseout事件 谢谢 <html> <body> <div>
onmouseoverlililionmouseoutonmouseout<html>
<body>
<div>
<ul>
<li onmouseover="console.info('over')" onmouseout="console.info('out')" style="float:left;display:block;width:30%;height:200px;border: 2px solid red;">
<img src="https://www.google.com/intl/en_com/images/srpr/logo3w.png">
<br/>
<br/>
<a href="#">Google</a>
</li>
<li style="float:left;display:block;width:30%;">
<img src="https://www.google.com/intl/en_com/images/srpr/logo3w.png">
<br/>
<br/>
<a href="#">Google</a>
</li>
<li style="float:left;display:block;width:30%;">
<img src="https://www.google.com/intl/en_com/images/srpr/logo3w.png">
<br/>
<br/>
<a href="#">Google</a>
</li>
</ul>
</div>
</body>
</html>
-
-
-
imgmouseoutli事件停止冒泡取消冒泡event.targetevent.srcElementlifunction handler(event) {
event = event || window.event; // IE
var target = event.target || event.srcElement; // IE
if(target === this) { // event originated where the handler was bound to
console.info('out');
}
}
onmouseout="handler.call(this, event);"
我建议您阅读。。因此，当光标离开
imgmouseoutli事件停止冒泡取消冒泡event.targetevent.srcElementlifunction handler(event) {
event = event || window.event; // IE
var target = event.target || event.srcElement; // IE
if(target === this) { // event originated where the handler was bound to
console.info('out');
}
}
onmouseout="handler.call(this, event);"
我建议阅读。除了
onMouseOveronMouseEnteronMouseLeaveonMouseOveronMouseEnteronMouseLeavemouseentermouseovermouseentermouseoverliimgonmouseoverimglililimouseovermouseoverliimglilionmouseoutimglionmouseoverli