addEventListener(）方法，事件监听
发布时间
阅读量：
阅读量
使用
addEventListener()方法进行事件监听
通过removeEventListener()函数实现移除事件监听
语法
addEventListener()
element.addEventListener(event, function, useCapture);- 第一个参数指定事件类型（例如 "click" 或 "mousedown"）。
- 第二个参数是用于处理事件发生的函数。
- 第三个参数是一个布尔值，用于确定事件是冒泡还是被捕获（此属性可选，默认为 false）。
- 将
<p>元素嵌入到<div>元素内部。 - 当用户点击
<p>元素时，默认设置为冒泡：false。 - 捕获：true
- 当外部元素触发事件时才会被捕获（当
div元素被点击时才会触发<p>内部元素的点击事件）。
- 当外部元素触发事件时才会被捕获（当
element.addEventListener("click", function(){ alert("Hello World!"); });
// ————————————————————————————————————
element.addEventListener("click", myFunction);
function myFunction() {
alert ("Hello World!");
}
// ————————————————————————————————————
// 传递参数
var p1 = 5;
var p2 = 7;
document.getElementById("myBtn").addEventListener("click", function() {
myFunction(p1, p2);
});
function myFunction(a, b) {
var result = a * b;
document.getElementById("demo").innerHTML = result;
}
// ————————————————————————————————————
// 浏览器兼容性处理
// 可以使用 detachEvent() 方法来移除事件句柄
var x = document.getElementById("myBtn");
if (x.addEventListener) { // 所有主流浏览器，除了 IE 8 及更早版本
x.addEventListener("click", myFunction);
} else if (x.attachEvent) { // IE 8 及更早版本
x.attachEvent("onclick", myFunction);
}removeEventListener()
element.removeEventListener("mousemove", myFunction);全部评论 (0)
还没有任何评论哟~