0

测试.html：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>mouseout test</title>

<script type="text/javascript">

window.addEventListener('load', function() {
    document.getElementById("a").addEventListener('mouseout', function() { 
            console.log("mouseout");
        });
    document.body.addEventListener('mouseout', function() { 
            console.log("bodymouseout");
        });
    });
</script>
<style>
#a{ border:1px solid black; width:300px; height: 300px;}
</style>
</head>
<body>
    <div id="a">
        move mouse out of this div
    </div>
</body>
</html>

测试框架.html：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>mouseout test frame</title>
<style>
iframe 
{
    width: 330px;
    height: 330px;
}

#a{ border:1px solid green; width:350px; height: 350px;}

</style>
</head>
<body>
    <iframe src="test.html"/>
</body>
</html>
  • 在testframe.htmlChrome 中加载时（在 Windows 上），将浏览器调整为窄，以便 div 的右边缘被切断。
    • 将鼠标移出右侧的 div。没有 mouseout 事件。
  • 当浏览器窗口足够大以显示整个 div 时，将鼠标移出 div 的所有侧面时会触发 mouseout。
  • 当test.html直接在浏览器中加载时，无论浏览器窗口大小如何，当将鼠标移出所有侧面时都会触发 mouseout 事件。

在 Firefox 中正常工作（除非有人可以证明 Chrome 的行为是正确的）。

在这种情况下，对检测鼠标何时移出 div 的解决方法有什么建议吗？

我还尝试将 mouseout 事件处理程序添加到 iframe 中的文档和窗口对象，但没有成功。

4

0 回答 0