Window addEventListener()
示例
在窗口添加点击事件处理程序
window.addEventListener("click", myFunction);
function myFunction() {
document.getElementById("demo").innerHTML = "Hello World";
}
亲自尝试 »
更简单的语法
window.addEventListener("click", function(){
document.getElementById("demo").innerHTML = "Hello World";
});
亲自尝试 »
以下有更多示例。
描述
该 addEventListener()
方法将事件处理程序附加到窗口。
文档方法
元素方法
教程
语法
window.addEventListener(event, function, Capture)
参数
参数 | 描述 |
event | 必填。 事件名称。 不要使用 "on" 前缀。 使用 "click" 而不是 "onclick"。 HTML DOM 中的所有事件都在以下列出: HTML DOM 事件对象参考. |
function | 必填。 事件发生时要运行的函数。 事件发生时,事件对象作为第一个参数传递给函数。事件对象的类型取决于指定的事件。例如,"click" 事件属于 MouseEvent 对象。 |
capture | 可选(默认值为 false)。true - 处理程序在捕获阶段执行。false - 处理程序在冒泡阶段执行。 |
返回值
无 |
更多示例
您可以向窗口添加多个事件监听器
window.addEventListener("click", myFunction1);
window.addEventListener("click", myFunction2);
亲自尝试 »
您可以添加不同类型的事件
window.addEventListener("mouseover", myFunction);
document.addEventListener("click", someOtherFunction);
window.addEventListener("mouseout", someOtherFunction);
亲自尝试 »
传递参数时,使用 "匿名函数" 来调用带有参数的函数
window.addEventListener("click", function() {
myFunction(p1, p2);
});
亲自尝试 »
更改文档的背景颜色
window.addEventListener("click", function(){
document.body.style.backgroundColor = "red";
});
亲自尝试 »
使用 removeEventListener() 方法
// 添加事件监听器
window.addEventListener("mousemove", myFunction);
// 删除事件监听器
window.removeEventListener("mousemove", myFunction);
亲自尝试 »
浏览器支持
addEventListener
在所有浏览器中都受支持
Chrome | Edge | Firefox | Safari | Opera | IE |
是 | 是 | 是 | 是 | 是 | 是 |