绑定事件 addEventListener
Posted limeOracle
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了绑定事件 addEventListener相关的知识，希望对你有一定的参考价值。
addEventListener() 方法用于向指定元素添加事件句柄。
addEventListener() 方法添加的事件句柄不会覆盖已存在的事件句柄。
你可以向一个元素添加多个事件句柄。
你可以向同个元素添加多个同类型的事件句柄，如：两个 "click" 事件。
你可以向任何 DOM 对象添加事件监听，不仅仅是 html 元素。如： window 对象。
addEventListener() 方法可以更简单的控制事件（冒泡与捕获）。
当你使用 addEventListener() 方法时, javascript 从 HTML 标记中分离开来，可读性更强， 在没有控制HTML标记时也可以添加事件监听。
你可以使用 removeEventListener() 方法来移除事件的监听。
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>菜鸟教程(runoob.com)</title> </head> <body> <p>该实例使用 addEventListener() 方法向同个按钮中添加两个点击事件。</p> <button id="myBtn">点我</button> <script> var x = document.getElementById("myBtn"); for(var i = 0;i < 3;i++){ //内部函数 x.addEventListener("click", function(){ alert("hhh");}); //内部函数调用匿名函数 x.addEventListener("click", function(){ myFunParam(2,3); }); //调用函数再调用匿名函数 x.addEventListener("click",myFunctionParam); //调用函数 x.addEventListener("click", myFunction); } function myFunction() { alert ("Hello World!") } function myFunParam(a,b){ alert(a + b); } function myFunctionParam(){ myFunParam(3,4); } </script> </body> </html>
以上是关于绑定事件 addEventListener的主要内容，如果未能解决你的问题，请参考以下文章
javascript绑定事件addEventListener与attachEvent