`

JavaScript通过attachEvent和detachEvent方法处理带参数的函数

阅读更多
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 2<html xmlns="http://www.w3.org/1999/xhtml">
 3<head>
 4<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 5<title>无标题文档</title>
 6<script language="javascript">
 7
 8    var theP;  //P标签对象
 9   
10    var show=function(msg){    //直接定义 function show(msg) 效果是一样的
11        return function(){   
12            alert(msg+" from show()");
13
14            if(window.addEventListener){  //FF etc.
15                 theP.removeEventListener("click", theP.show11, false);
16            }
17            else{ //IE
18                 theP.detachEvent("onclick", theP.show11);
19            }
20        }
21    }
22
23    var show2=function(msg){    //直接定义 function show2(msg) 效果是一样的
24        return function(){   
25            alert(msg+" from show2()");
26        }
27    }
28   
29    function showDef(){
30        alert("showDef()");           
31       
32         if(window.addEventListener){  //FF etc.
33              theP.removeEventListener("click", showDef, false);
34         }
35         else{ //IE
36              theP.detachEvent("onclick", showDef);
37         }
38    }
39   
40    window.onload=function(){
41        theP=document.getElementById("pid");
42       
43        theP.show11=show("可以detach的带参数方法");
44       
45        if(window.addEventListener) // not IE
46        {
47            //for FF.etc
48            theP.addEventListener("click", theP.show11, false);
49            theP.addEventListener("click", showDef, false);
50        }
51        else
52        {
53            //for IE           
54            theP.attachEvent("onclick", theP.show11);
55            theP.attachEvent("onclick", show2('不能detach的带参数方法'));//区别于上一个,这里不能detach
56           
57            theP.attachEvent("onclick", showDef);  //无参数的方法直接写
58        }       
59    }
60</script>
61
62</head>
63
64<body >
65<div >
66    <p id="pid">Click Me</p>
67</div>
68</body>
69</html>
分享到:
评论

相关推荐

    javascript打造跨浏览器事件处理机制[Blue-Dream出品]

    - **IE浏览器支持**:如果检测到不支持标准方法,那么函数会尝试使用`attachEvent`和`detachEvent`来添加和移除事件监听。 - **老旧浏览器**:如果浏览器既不支持`addEventListener`也不支持`attachEvent`,则直接...

    探究JavaScript中的五种事件处理程序方式

    Internet Explorer浏览器使用`attachEvent`和`detachEvent`方法,与DOM2级事件处理程序类似,但不支持捕获阶段。 ```javascript button.attachEvent('onclick', function() { alert('success'); }); ``` 需要注意的...

    探究JavaScript中的五种事件处理程序1

    第四部分,IE事件处理程序使用`element.attachEvent`和`element.detachEvent`,如`element.attachEvent('onclick', handler)`,IE特有的,不支持事件捕获,也没有标准的事件对象。 第五部分,跨浏览器的事件处理...

    javascript 添加和移除函数的通用方法

    在JavaScript编程中,为DOM元素添加和移除事件处理函数是一种常见的操作。为了确保兼容不同浏览器并优化性能,我们需要掌握通用的添加和移除函数的方法。本文档将详细介绍实现这一目标的技术细节和步骤。 首先,...

    javascript中的绑定与解绑函数应用示例.docx

    本文将详细介绍如何在不同的浏览器环境中(主要是 Mozilla 和 Internet Explorer)使用绑定与解绑函数,并通过实际代码示例进行演示。 #### 二、事件绑定 ##### 2.1 `addEventListener` 方法 (W3C 标准) **语法**...

    javascript事件处理模型实例说明

    本文详细介绍了JavaScript事件处理模型,重点讲述了Internet Explorer(IE)和Mozilla Firefox(火狐)这两款主流浏览器在添加和删除事件监听器方面的差异,以及提供了一个通用的解决方案,从而允许开发者能够编写...

    详解JavaScript中的大事流和大事处理程序_.docx

    对于IE浏览器,其事件处理程序使用`attachEvent`和`detachEvent`方法,它们只支持冒泡阶段的事件处理。需要注意的是,由于匿名函数无法被引用,所以在IE中使用`detachEvent`移除事件处理程序时可能会遇到问题。 ...

    javascript 处理事件绑定的一些兼容写法

    `removeEvent`函数处理了`removeEventListener`和`detachEvent`: ```javascript var removeEvent = function( obj, type, fn ) { if (obj.removeEventListener) obj.removeEventListener( type, fn, false ); ...

    JavaScript将DOM事件处理程序封装为event.js 出现的低级错误问题.docx

    错误②:在IE事件处理程序中,错误地使用了`attach`或`detach`而不是`attachEvent`和`detachEvent`。这两个是IE浏览器特有的事件绑定和解绑方法,必须注意它们的拼写和大小写。修正拼写错误后,事件处理程序才能在IE...

    javascript 跨浏览器的事件系统

    他的封装方法通过检查DOM元素的events属性来管理事件监听器,允许绑定多个事件处理器,并通过for循环来调用它们。 然而,文章也提到,这种方法可能不是最优的。作者最终打算使用更原始的方法,即直接使用onXXXX属性...

    javascript大事绑定学习要点_.docx

    这两个方法的用法与`addEventListener`和`removeEventListener`类似,但有一些差异,比如事件处理函数的`this`指向不同,以及没有第三个参数来控制事件冒泡。 此外,事件对象(Event Object)在事件处理中扮演重要...

    javascript 操作 dom 的常用方法

    13. `addEventListener` 和 `removeEventListener` 方法:在DOM2级事件中,这两个方法用于添加和移除事件监听器,支持多个事件处理程序,与IE中的`attachEvent`和`detachEvent`相类似,但更现代且跨浏览器。...

    JavaScript

    3. **事件处理**:JavaScript通过事件监听和处理函数实现用户交互。常见的事件有点击(click)、鼠标悬停(mouseover)、页面加载(load)等。事件处理器可以使用addEventListener或attachEvent(IE浏览器)添加,...

    JavaScript中的跨扫瞄器大事操作的基本方法整理_.docx

    以上所述是JavaScript中处理跨浏览器事件操作的基本方法,这些方法和函数可以帮助开发者编写出兼容各种浏览器的事件处理代码,从而提升应用的可用性和用户体验。在实际开发中,还可以结合现代JavaScript库(如jQuery...

    实例讲解javascript注册事件处理函数

    第二种方式是通过JavaScript代码动态绑定事件处理函数,即事件句柄方式。例如: ```javascript var bt = document.getElementById("bt"); bt.onclick = function() { mydiv.style.backgroundColor = "green"; }; ``...

    Javascript典型应用例程(源程序)

    例如,如何使用addEventListener或attachEvent来绑定事件,以及如何使用removeEventListener或detachEvent来移除事件。 还有DOM(文档对象模型)操作,这是JavaScript与HTML进行交互的方式。通过DOM,JavaScript...

    【JavaScript源代码】JavaScript中事件冒泡机制示例详析.docx

    为了移除已经添加的事件监听器,可以使用`removeEventListener`方法,提供相同的事件名和处理函数作为参数。 对于不支持`addEventListener`和`removeEventListener`的旧版IE和Opera浏览器,可以使用`attachEvent`和...

Global site tag (gtag.js) - Google Analytics