Jquery 给一div注册事件问题

Jquery 给一div注册事件问题，在jQuery给一个div注册事件的时候（如mouseover事件）时，同时会把div中的子元素也注

册上同样的事件。

html代码如下：

<div id="top" style="backgroud:gray;width:500px;height:600px;">
    <div id="mid" style="backgroud:green;width:300px;height:400px;">
        <div id= "thrid"  style="backgroud:red;width:100px;height:200px;">
        </div>
    </div>
</div>
<div id="log"></div>

Jquery代码：

jQuery(funciton ($){
  $("#top").mouseover(funciton (){
     log($(this).attr("id")+"top over");
  });
  $("#top").mouseout(funciton (){
     log($(this).attr("id")+"top out");
  });
});

function log(msg){
 jQuery("#log").append(msg+"<br/>");
}

现在这种情况是当鼠标经过上面三个div（top，mid，third）中任何一个div时，都会触发 mouseover与mouseout事件

这不是我所想要的网上找了相关资料解决办法如下：

修改mouseout事件

  $("#top").mouseout(funciton (e){
     var e=e||window.event; //获取事件
    var obj=e.relatedTarget||e.toElement; //获取mouseout 进入元素
    f(obj != null && jQuery("#top").find(jQuery(obj)).length >0){
//obj找到了，只需判断他是不是绑定事件元素的子元素就可以了，如果是就不执行后面的事件 否则就执行
     log($(this).attr("id")+"is child");
}else{
    log($(this).attr("id")+"top out");
}
     
  });

参考：http://q.cnblogs.com/q/28184/

http://topic.csdn.net/u/20100417/16/9e1681e8-29b9-46c3-b764-a4d36545b226.html

注：纯手工敲写，有误自调

http://www.ibuyincn.com

Jquery 给一div注册事件问题

猜你喜欢