js中addachEvent,addEventListener的使用方法-优快云博客

本文介绍了JavaScript中不同浏览器下事件绑定及解除绑定的方法。包括非IE浏览器的addEventListener和removeEventListener的使用，以及IE浏览器特有的attachEvent和detachEvent。通过示例代码展示了如何在元素上动态添加点击事件，并提供了移除这些事件的实现。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

代码

①
// js中addachEvent,addEventListener的使用方法
// 非IE浏览器的动态添加,注销事件的方法
el.addEventListener( ' click ' , msg, false ); // 添加
el.removeEventListener( ' click ' , msg, false ); // 注销
// IE中动态添加事件的方法
el.attachEvent( ' onclick ' ,msg); // 添加
el.detachEvent( ' onclick ' ,msg); // 注销
例:
< body >
< input id = " 123 " type = " text " id = " test " value = " 点击 " />
< input id = " Button1 " type = " button " onclick = " ok() " value = " 删除动态添加的事件 " />
< script >
var el = document.getElementById( " 123 " ); // 先取得对象
alert( " el.addEventListener== " + el.addEventListener); // 提示
alert( " el.attachEvent== " + el.attachEvent);
if (el.addEventListener) // 用于 Mozilla系列
{
el.addEventListener( ' click ' , msg, false );
}
else if (el.attachEvent) // 非Mozilla系列(IE)
{
el.attachEvent( ' onclick ' , msg);
}
if (window.addEventListener) //
{
window.addEventListener( ' load ' ,msg, false );
}
else if (window.attachEvent)
{
window.attachEvent( ' onload ' , msg);
}
function msg()
{
alert( " 我是动态添加的 " );
}
function ok()
{
if (el.removeEventListener) // 用于 Mozilla系列
{
el.removeEventListener( ' click ' , msg, false );
}
else if (el.detachEvent) // IE中动态添加事件的方法
{
el.detachEvent( ' onclick ' , msg);
}
}
</ script >
</ body >

转载于:https://www.cnblogs.com/kelin418/archive/2010/12/14/1905950.html