javascript如何阻止事件冒泡和默认行为

JavaScript022

javascript如何阻止事件冒泡和默认行为,第1张

js阻止冒泡

在阻止冒泡的过程中，W3C和IE采用的不同的方法，那么我们必须做以下兼容。

复制代码 代码如下:

function stopPro(evt){

var e = evt || window.event

//returnValue如果设置了该属性，它的值比事件句柄的返回值优先级高。把这个属性设置为 fasle，

//可以取消发生事件的源元素的默认动作。

//window.event?e.returnValue = false:e.preventDefault()

window.event?e.cancelBubble=true:e.stopPropagation()

}

js阻止默认事件的方式有两种：

使用e.preventDefault()方法，例子如下  

/**

* 1.阻止元素的默认事件，但是不会阻止事件冒泡

*/

var link = document.getElementsByTagName('a')[0]

link.addEventListener('click',function(e){

          e.preventDefault()

})

 2.如果是在jquery中，可以使用return false,例子如下：

/**

* 2.阻止元素的事件冒泡

* Jquery和原生的Js在这点上有些不同，

* 原生的Js要通过e.stopPropagation()方法阻止事件冒泡

* 而Jquery则可以直接return false来阻止事件冒泡

* e.stopPropagation()方法不会阻止元素的默认行为，但是

* return false会阻止元素的默认行为。

*/

var btn = document.getElementById('btn')

btn.addEventListener('click',function(e){

return false

})