JS阻止事件冒泡以及浏览器默认行为

e的兼容


1
2
3
function fn(e){
var event = e || window.event;
}

FireFox里的EventIE里的不同,IE里的是全局变量,随时可用。FireFox里的要用参数引导才能用,是运行时的临时变量
IE/Opera中是window.event,在FireFox中是event。而事件的对象,在IE中是window.event.srcElement,在Firefox中是event.targetOpera中两者都可用

阻止事件冒泡


W3C的方法是e.stopPropagation()IE则是使用e.cancelBubble = true
stopPropagation是事件对象Event的一个方法,作用是阻止目标元素的冒泡事件,但是不会阻止默认行为
什么是冒泡事件?如在一个按钮是绑定一个click事件,那么click事件会依次在它的父级元素中被触发,stopPropagation就是阻止目标元素的事件冒泡到父级元素
了解更多请点这:理解DOM中的事件流

阻止事件冒泡兼容:

1
2
3
4
5
6
7
8
function stopPropagation(e) {
var e = e || window.event;
if ( e && e.stopPropagation ){
e.stopPropagation();
}else{
e.cancelBubble = true;
}
}

阻止浏览器默认行为


W3C的方法是e.preventDefault()IE则是使用e.returnValue = false
preventDefault是事件对象Event的一个方法,作用是取消一个目标元素的默认行为。如果元素没有默认行为,调用无效。什么元素有默认行为呢?如链接<a href="xxx">点我</a>,提交按钮<input type=”submit”>

return false:
JSreturn false只会阻止默认行为,而jQuery则既阻止默认行为又防止对象冒泡
阻止浏览器默认行为兼容:

1
2
3
4
5
6
7
8
9
function stopDefault(e) {
var e = e || window.event;
if (e && e.preventDefault){
e.preventDefault();
}else{
e.returnValue = false;
}
return false;
}

如果您觉得我的文章对您有用,请随意打赏。

您的支持将鼓励我继续创作!

¥ 打赏支持

文章导航

目录

×
  1. 1. e的兼容
  2. 2. 阻止事件冒泡
  3. 3. 阻止浏览器默认行为