html标签隐藏难题

htmljs鼠标ajax标签

解决方案 »

  1.   

    当鼠标在该元素的子元素上移动，但是并没移出改元素时onmouseout事件也被触发了，解决方案如下：
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link href="common.css" type="text/css" rel="stylesheet" />
    <title>弹出层</title><style>
    div{padding:50px;}
    .box{background:red;}
    .box1{background:blue;}
    </style>
    <script>
    window.onload=function(){


    var oBox=document.getElementById('box');
    //方案一：采用定时器来解决
    /*var iTimer=null;
    oBox.onmouseout=function(){
    iTimer=setTimeout(function(){
    oBox.style.display='none';
    },40);

    }
    oBox.onmouseover=function(){
    clearTimeout(iTimer);
    }*/
    //方案二：移出改为事件onmouseleave
    oBox.onmouseleave=function()
    {
    this.style.display='none';
    }
    }
    </script>
    </head>
    <body>
    <div class="box" id="box">
    <div class="box1" id="box1"></div>
    </div>
    </body>
    </html>
      

  2.   

    用个定时器是个不错的方法，可是我鼠标放到动态的div超过时间还是会隐藏啊
      

  3.   

    oBox.onmouseover中不是已经清除定时器了吗？你所说的是什么情况？当鼠标从最外层移入内层div的时候，会触发外层的onmouseout,同时触发内层的onmouseover,基于最外层的定时器不是立即执行，而是由一定的延迟，有因为页面元素事件的冒泡机制，其值内层触发了onmouseover同时会传递给父级，在瞬间的切换中清除了定时器，使得隐藏代码无法执行，有什么问题？
      

  4.   

    多谢我知道我的问题在那里了(onmouseout是指离开指定元素,而onmouseleave是离开指定元素的范围(区域))
    我的事件监听使用了onmouseout