attachEvent() / addEventListener() 对象添加触发事件(转)
有时候当某一对象的某一事件被触发时，它所要执行的程序可能是一大串，有可能是要呼叫某一函数，也有可能同时又要呼叫另一函数。
document.getElementById("btn").onclick = method1;
document.getElementById("btn").onclick = method2;
document.getElementById("btn").onclick = method3;
如果这样写,那么将会只有medhot3被执行
在IE中使用addachEvent ,
var btn1Obj = document.getElementById("btn1");
//object.attachEvent(event,function);
btn1Obj.attachEvent("onclick",method1);
btn1Obj.attachEvent("onclick",method2);
btn1Obj.attachEvent("onclick",method3);
执行顺序为method3->method2->method1
Mozilla系列中需要使用 addEventListener
var btn1Obj = document.getElementById("btn1");
//element.addEventListener(type,listener,useCapture);
btn1Obj.addEventListener("click",method1,false);
btn1Obj.addEventListener("click",method2,false);
btn1Obj.addEventListener("click",method3,false);
执行顺序为method1->method2->method3
看看gmail的代码
var Ka=navigator.userAgent.toLowerCase();
var rt=Ka.indexOf("opera")!=-1;
var r=Ka.indexOf("msie")!=-1&&(document.all&&!rt);
function Zl(a,b,c){if(r){a.attachEvent("on"+b,c)}else{a.addEventListener(b,c,false)}}
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<script language="javascript">
var agent=window.navigator.userAgent.toLowerCase();
//var a=agent.indexOf('opera')!=-1;
var b=agent.indexOf('msie')!=-1 //&& (document.all && !a)
function addEvent(obj,fun,e){
if(b){
obj.attachEvent('on'+e,fun);
}else{
obj.addEventListener(e,fun,false);
}
}
function testtest(){
alert('sdfsdfsdf');
}
window.onload=function(){
var objbutton=document.getElementsByTagName('input')[0];
addEvent(objbutton,testtest,'click');
}
</script>
</head>
<body>
<form>
<input type="button" name="button1" value="测试" />
</form>
</body>
</html>
分享到：
相关推荐
在JavaScript中，`attachEvent` 和 `addEventListener` 是两种用于为元素添加事件处理程序的方法，主要在Internet Explorer和非IE浏览器（遵循W3C标准）中使用。它们都是用来监听和响应用户或浏览器的特定行为，如...
在这段代码中，`attachEvent`方法用于在指定元素上绑定事件处理函数，`createEventObject`用于创建一个事件对象实例，然后`fireEvent`方法触发指定的事件。 而对于现代浏览器，如Chrome和Firefox，它们使用`...
### JavaScript中的事件处理：attachEvent与addEventListener #### 一、引言 JavaScript 是一种广泛使用的脚本语言，它被用于实现网页的动态效果和交互功能。随着 Web 技术的发展，浏览器之间的差异也逐渐显现出来...
在JavaScript中，`addEventListener`和`attachEvent`都是用于向元素添加事件监听器的方法，但它们之间存在一些关键差异，特别是在处理`this`关键字时。`addEventListener`是W3C标准的一部分，被大多数现代浏览器支持...
综上所述，JavaScript动态添加事件涉及到多种技术，包括`setAttribute`、`attachEvent`、`addEventListener`，以及针对不同浏览器的兼容性策略。在实际开发中，应根据项目需求和浏览器支持情况选择合适的方法。
DOM2级事件处理程序引入了`addEventListener`和`removeEventListener`方法，允许在捕获或冒泡阶段添加和移除事件处理程序。添加事件处理程序时，第三个参数为布尔值，决定事件是在捕获阶段还是冒泡阶段触发。DOM2级...
事件对象可以通过多种方式attach到HTML元素上，例如使用addEventListener方法或attachEvent方法。addEventListener方法是W3C标准，它可以在Mozilla系列浏览器中使用，而attachEvent方法则是IE浏览器专用的方法。 ...
在JavaScript中，动态地给对象添加事件是常见的需求，特别是在构建交互式的Web应用程序时。这里我们将深入探讨如何使用JavaScript来实现这一功能，并讨论浏览器兼容性问题。 首先，我们需要理解两个主要的方法来...
可能你也碰到过这种情况,就是在js的代码中用了[removed]后,可能会影响到body中的onload事件。你可以全写在body中，也可以全放到[removed]中，但是这样并不是很方便，有时我们需要两个同时用到。这时就要用window....
在编写事件处理函数时，我们还可以利用事件对象（event object）获取有关触发事件的信息，比如事件类型、触发事件的元素等。此外，还可以通过`event.preventDefault()`阻止默认行为，通过`event.stopPropagation()`...
在JavaScript中，我们可以自定义事件处理程序来实现这样的功能，这通常涉及到`addEventListener`或`attachEvent`（对于旧版IE浏览器）这两个方法。 首先，`addEventListener`是W3C标准的方法，用于向元素添加事件...
- `addEventListener` 的 `this` 指向触发事件的元素，而 `attachEvent` 的 `this` 指向 `window` 对象。 - 同名事件的执行顺序不同：`addEventListener` 是按照添加顺序执行，`attachEvent` 则相反。 2. **事件...
此外，还需要注意事件对象的差异。 3. **清理事件监听器**：在不再需要某个DOM元素时，应该及时移除其上的事件监听器，防止内存泄漏。可以使用`removeEventListener`或`detachEvent`方法来移除事件监听器。 综上所...
在IE浏览器中，`attachEvent`用于添加事件监听器，而`addEventListener`是W3C标准的事件处理方式，被Firefox等现代浏览器所支持。两者的主要差异在于`this`的指向： - 在IE的`attachEvent`中，`this`指向全局对象`...
- **IE中事件对象** (`event`): 在Internet Explorer中，事件对象是全局变量`window.event`。 - **标准浏览器中事件对象** (`e` 或 `event`): 在非IE浏览器中，事件对象通常是函数参数。 **IE中事件对象的主要属性...
对于右键菜单，我们关注的是"contextmenu"事件，它会在用户按下鼠标右键时触发。例如： ```javascript document.addEventListener('contextmenu', function(event) { event.preventDefault(); // 阻止浏览器默认的...
这里创建了一个`MouseEvents`类型的事件对象，然后通过`initEvent`设置事件类型、是否冒泡以及是否取消默认行为。然后根据浏览器类型，调用相应的触发事件的方法。 总结起来，这个例子展示了以下JavaScript事件处理...
事件对象在不同浏览器中可能有不同的名称。在W3C标准中，它作为参数传递给事件处理函数，而在IE中，它可以通过`window.event`访问。为兼容处理，可以这样做： ```javascript option.onchange = function(event) ...