一个鼠标进入元素和退出元素时触发动画效果函数,但是因为该元素里包含有子元素,所以当鼠标在子元素上时也会触发函数
怎样才能去除子元素的触发,就像只有父元素才会触发的效果呢

解决方案 »

  1.   

    比如你子元素是li就这么写
    $('li').bind('mouseover',function(){return false;})
      

  2.   

    另可考虑event的targetElement(srcElement)作判断
      

  3.   

    不一定非要用JQ
    看一下js事件的冒泡和捕获 自己就知道怎么用事件event来处理这种情况
      

  4.   

    <!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>
        <title>无标题页</title>
    </head>
    <body>
    <div style="width:100px;height:100px;border:1px solid #000" id="div">
    <div style="width:50px;height:50px;border:1px solid red;margin:25px auto 0 auto"></div>
    </div>
    <p id="msg"></p>
    <script type="text/javascript">
    var p = document.getElementById("msg");
    var div = document.getElementById("div");
    div.onmouseover = function()
    {
       p.innerHTML = p.innerHTML + "移入了div<br/>"
    }
    div.onmouseout = function(e)
    {
       var to = e ? e.relatedTarget : window.event.toElement;
       while(to)
       {
           if(to == this) return;
       to = to.parentNode;
       }
       p.innerHTML = p.innerHTML + "移出了div<br/>"
    }
    </script>
    </body>
    </html>
      

  5.   

    先选择整个元素,然后not(不需要的子元素),就OK了
    $(".test").not($("#test")).animate()......