JS事件流其中一种是冒泡事件,当一个元素被触发一个事件时,该目标元素的事件会优先被执行,然后向外传播到每个祖先元素,恰如水里的一个泡泡似的,从产生就一直往上浮,到在水平面时,它才消失。在这个过程中,如果你只希望事件发生在目标元素,而不想它传播到祖先元素上去,那么你需要在“泡泡”离开对象之前刺破它。
function stopPropagation(e) {
e = e || window.event;
if(e.stopPropagation) { //W3C阻止冒泡方法
e.stopPropagation();
} else {
e.cancelBubble = true; //IE阻止冒泡方法
}
}
或者如下:
function stopPro(evt){
var e = evt || window.event;
//returnValue如果设置了该属性,它的值比事件句柄的返回值优先级高。把这个属性设置为 false,
//可以取消发生事件的源元素的默认动作。
//window.event?e.returnValue = false:e.preventDefault();//默认事件
window.event?e.cancelBubble=true:e.stopPropagation();
}
jQuery做法:
方式一:event.stopPropagation();
1 $("#div1").mousedown(function(event){
2 event.stopPropagation(); //阻止冒泡事件,上级的xxx事件不会被调用,但不阻止事件本身
3 });
方式二:return false;
1 $("#div1").mousedown(function(event){
2 return false; //不仅阻止了事件往上冒泡,而且阻止了事件本身
3 });