<div id="d1" onmouseover="(打开d2)" onmouseout="(关闭d2)">
<div id="d2">你好</div></div>
我鼠标移动到d1层上 d2的内容一闪就过了 好像是触发了 d1 的onmouseout有没有办法 鼠标移动到D2上面的时候 不关闭 只有鼠标移到d1外才触发 onmouseout
<div id="d2">你好</div></div>
我鼠标移动到d1层上 d2的内容一闪就过了 好像是触发了 d1 的onmouseout有没有办法 鼠标移动到D2上面的时候 不关闭 只有鼠标移到d1外才触发 onmouseout
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script language="javascript">
function openD2(evt)
{
document.getElementById("d2").style.display="";
}
function closeD2(evt)
{
document.getElementById("d2").style.display="none";
}
</script>
<style type="text/css">
<!--
#d1 {
position:absolute;
left:127px;
top:103px;
width:362px;
height:179px;
z-index:1;
background-color: #003333;
}
#d2 {
position:absolute;
left:93px;
top:65px;
width:202px;
height:90px;
z-index:1;
background-color: #CCCCCC;
}
-->
</style>
</head><body>
<div id="d1" onmouseover="openD2()" onmouseout="closeD2()">
<div id="d2">你好</div>
</div>
</body>
</html>
其次楼上这样虽然看不出有什么不正常,但是因为事件冒泡的问题,其工作方式可能并不是你想要的那样。
把代码改成这样试试就可以看出问题来了
function openD2(evt)
{
document.getElementById("d2").style.display="";
alert("open");
}
function closeD2(evt)
{
document.getElementById("d2").style.display="none";
alert("close");
}避免这个问题可以去搜索一下“阻止事件冒泡”