Div嵌套Div时的(OnMouseOut)事件处理

在Div嵌套Div时，如果在最顶层DIV写了一个OnMouseOut事件，那么在普通情况下当你移到内层DIV上的时候就会触发到这个事件，但是这往往不是我们想要看到的，这种情况时有以下两种解决方案。

方案一（推荐）
利用Jquery解决
    在Jquery中可以直接为要加事件的方法加入到对象中，比如$("#areaSelect").bind("mouseleave",hideAreaSelectForDiv);，在这种情况下Jquery会根据不同的浏览器来用合适的方法处理，减少了很多工作量，不用再去判断，这样写了后只有顶层DIV移出的时候才会触发OnMouseOut事件了。


方案二 （只有IE能用）
直接把对象上的OnMouseOut改成OnMouseLeave这样也会解决




备忘情况
在DIV嵌套DIV时，两个DIV都有自己的ONCLICK方法，普遍情况下，当点击里层ONCLICK方法也外层的ONCLICK方法也会被触发，这时需要判断“事件冒泡”代码如下，加入后就不会再触发到外层的ONCLICK方法

//阻止事件冒泡函数
function stopBubble(e)
{
    if (e && e.stopPropagation)
        e.stopPropagation()
    else
        window.event.cancelBubble=true
}

评论

1 楼 xiuoymxiuo 2013-12-16  

用上了