cancelBubble和stopPropagation有什么区别？

Question

任何人都可以告诉我在javascript 中使用cancelBubble和使用的stopPropagation方法的差异.

Answer 1

cancelBubble是一个仅限IE的布尔属性(不是方法),其作用与stopPropagation()其他浏览器的方法相同,即阻止事件移动到下一个目标(当事件从内部到外部时称为"冒泡"元素,这是事件在IE中传播的唯一方式<9).IE 9现在支持,stopPropagation()所以cancelBubble最终会变得过时.与此同时,以下是一个用于停止事件传播的跨浏览器函数:

function stopPropagation(evt) {
    if (typeof evt.stopPropagation == "function") {
        evt.stopPropagation();
    } else {
        evt.cancelBubble = true;
    }
}

在事件处理函数中,您可以按如下方式使用它:

document.getElementById("foo").onclick = function(evt) {
    evt = evt || window.event; // For IE
    stopPropagation(evt);
};

Answer 2

为了兼容IE8和旧版本,.cancelBubble如果.stopPropogation()未定义:

if(ev.stopPropagation)ev.stopPropagation();
else ev.cancelBubble=true; // where ev is an event object

在MSDN中阅读:http://msdn.microsoft.com/en-us/library/ff975961%28v=vs.85%29.aspx