addEventListener绑定事件失效的可能原因
addEventListener是DOM元素的api,能够对指定的dom元素进行事件监听的绑定。可用的事件类型非常多,列如click,keydown,keyup。如果是特殊的事件类型,就得看该dom元素是否能够支持,比如select的change事件,input的input事件。等等。
而且addEventListener能够很方便的控制事件是否冒泡,只需要加入第三个参数为false,能够阻止冒泡,为true则能在捕获阶段触发。
如果你的事件绑定没有成功,那么由一下几种可能:
1、元素获取问题 ---------绑定的元素由于css选择错误或其他原因导致,导致元素不是自己想绑定的。
2、 元素获取时,获取到的是一个集合,比如使用document.getTagNames()方法,或document.querySelectorAll()方法
另外如果想移除元素事件监听,就需要留心。我们需要像下面这样做:
// 绑定p元素点击事件 document.querySelector('p').addEventListener('click',callback,false); function callback () { alert('我被点了') } // 解除事件监听 document.querySelector('p').removeEventListener('click',callback,false); // 同样的需要用命名函数,进行解除,
或者用onclick更为直接的操作:
// 绑定事件 p.onclick = function() { alert('我被点了') } // 解除绑定 p.onclick = null;