attachEvent 传递参数

最新推荐文章于 2025-10-07 11:10:23 发布
转载 最新推荐文章于 2025-10-07 11:10:23 发布 · 1k 阅读 · 0
文章标签：

#function #button #input #html

本文介绍了一个简单的HTML页面示例，该示例演示了如何使用JavaScript为HTML元素跨浏览器地绑定点击事件。通过自定义函数AttachEvent实现事件监听器的附加，确保了在不同浏览器环境下的兼容性。

<html>
<head>
 <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
 <title></title>
</head>
<body>
 <a href="#" id="mylink">这是连接</a>

 <script type="text/javascript">
function AttachEvent(type, target, handler, owner)
{
        var eventHandler = handler;
    if(owner)
    {
    debugger;
            // 在这里重新定义一个处理函数
            eventHander = function(e)
            {
                   handler.call(owner, e);
            }
    }
  
    if(window.document.all)
            target.attachEvent("on" + type, eventHander );
    else
            target.addEventListener(type, eventHander, false);
}

function MyLink_Click(e)
{
        alert(this.tagName);
        var target = e.srcElement || e.target;
        alert(target.href);
}

function test()
{
 var mylink = window.document.getElementById("mylink");
 AttachEvent("click", mylink, MyLink_Click, mylink);

}
 </script>

 <input type="button" value="AttachEvent" onclick="test()" />
</body>
</html>

 

Javascript attachEvent传递参数的办法
10-29
在探讨Javascript中使用attachEvent方法传递参数的问题时，首先需要理解attachEvent和addEventListener之间的区别，以及它们在IE浏览器中的实现差异。attachEvent是IE 8及以下版本独有的事件绑定方法，而...
attachEvent的使用方法与传递参数[IE|firefox]|angluo-javascript-37392.pdf
10-30
在描述中的代码示例中，使用了闭包来解决`attachEvent`传递参数的问题。这里有两个版本的代码： 第一个版本中，`str`变量定义在立即执行的函数表达式（IIFE）内部，确保了其作用域的限制。在事件处理函数`func`中，...
JS中的attachEvent、addEventListener如何传递参数
weixin_30610755的博客
09-23 133
<!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 runat="server...
attachEvent的使用方法与传递参数[IE|firefox]
wenzi_li的专栏
12-10 377
[code] window.onload=function(){ var obj=document.getElementById("button1"); (function(){ var str="看到我了吧"; var func=function(){ alert(str); ...
JavaScript中attachEvent与addEventListener事件绑定详解
最新发布
weixin_35973118的博客
10-07 887
在Web开发中，事件驱动是实现用户交互的核心机制之一。JavaScript通过事件绑定将函数与特定的用户行为（如点击、鼠标移动、键盘输入等）关联起来，从而实现动态响应。随着浏览器技术的发展，事件绑定方式经历了从早期的内联事件处理到现代标准化API的演进。// 传统内联绑定（不推荐）element.onclick = function() { /* 处理逻辑 */ };// 现代标准绑定本章系统介绍了事件流模型（捕获、目标、冒泡）、两种主流注册方式的历史背景及设计差异，并引出为何与。
js绑定事件(attachEvent、addEventListener)传参
djy1135的专栏
02-28 1239
Untitled Page                                 test link                                           function bind(obj, type, fn, argsObject) {         var eventHandler = fn;
attachEvent传递参数
04-10 165
JavaScript中有时会用到给Html动态添加事件,在传递参数中需要注意下.下例中注释掉的部分运行会出问题,有人说这属于JavaScript闭包的问题至于何为闭包,管它的了.<html><head> <title>无标题页</title></head><body> <input id="Text...
window.open()实现post传递参数
09-03
然而，当需要通过POST方式传递参数时，`window.open()` 默认的GET方式就无法满足需求了。 在上述描述中，提到的问题是在SSH框架下，URL长度受限且需要隐藏某些参数，因此需要寻找一种方式来通过POST传递参数。一种...
attachEvent带参数函数调用问题
shenqi_1999的专栏
03-02 797
方案一与方案二区别是什么?方案一:var obj_input = document.getElementsByTagName("input");     for(var i=0; i         if(obj_input[i].type.toLowerCase() == checkbox){             var obj_ev = function(obj_chk){  
attachEvent(detachEvent) 和 addEventListener(removeEventListener)
一个半路出家的人
09-12 1226
 1,介绍添加多个两种方法 考虑到不同的人写同一个页面,有事后我们要为同一个元素添加多个事件,这些事件可能是相同的,因此我们有必要为一个元素同时添加多个元素 attachEvent  和 addEventListener 可以同时添加多个事件, attachEvent 谷歌,火狐Ie9版本以上大的浏览器都不支持     ie8以下的版本不支持 addEventListener 谷歌,火狐I...
attachEvent传递参数的办法
weixin_30414155的博客
10-29 171
使用attachEvent给对像绑定事件时，方法不能传递参数，经过了解，原来是javascript的闭包问题，导致得不能直接读取外部的那个函数，不然就所有传递的参数都变为最后一个了。解决办法如下： var newopen = function(id,level){ return function() { opentree(id,level);//该函数为外部定义的一个执行函数；...
JS添加/绑定事件监听函数并传参数attachEvent和addEventListener兼容个浏览器
哆啦咪^Pluser
03-30 4357
*  * 添加事件监听函数  *obj       要添加监听的对象或元素  * eventName  事件名  *fun       监听函数的名称  *param     给监听函数传的参数，这里就传了一个参数  * functionaddEventHandler(obj,eventName,fun,param=''){      var fn =fun;    if(pa
Javascript 的addEventListener()及attachEvent()区别分析
weixin_30535843的博客
07-31 174
Javascript 的addEventListener()及attachEvent()区别分析 详细出处参考：http://www.jb51.net/article/18220.htm###大家都知道事件的用法就是当某个事件(状况)被触发了之后就会去执行某个Function, 尤其是Javascript, 在当红AJAX的催化下, 了解Javascript的Event用法更加重要, 在...
attachevent
03-08
<think>好的，用户想了解关于“attachevent”的信息。首先，我得确认这个术语的具体含义和常见使用场景。AttachEvent听起来像是一个与事件处理相关的函数或方法，可能在编程中使用，尤其是在某些特定的框架或语言中。 首先，回忆一下，我知道在JavaScript中，早期IE浏览器（比如IE8及更早版本）使用attachEvent方法来为元素添加事件处理程序。而现代浏览器则使用addEventListener。这可能是一个关键点。用户可能是在处理跨浏览器兼容性问题，或者在学习旧版代码时遇到了这个方法。 接下来，需要确认用户的具体背景。如果他们是前端开发者，可能需要了解attachEvent的历史、语法、与现代方法的区别以及兼容性处理。如果他们只是初学者，可能需要更基础的解释，包括为什么存在不同的方法，以及现在应该如何正确使用事件处理。 然后，考虑用户可能的深层需求。他们可能遇到了某个使用attachEvent的旧代码库，需要维护或升级，因此需要了解如何替换或兼容这个方法。或者他们可能在面试或考试中遇到相关问题，需要理解其工作原理。 需要组织回答的结构，先介绍attachEvent是什么，它的语法，与addEventListener的区别，兼容性处理方法，以及现代替代方案。同时，提供代码示例会更有帮助，比如展示如何使用attachEvent，以及如何编写跨浏览器的代码。 还需要注意，用户可能对JavaScript的事件模型不太熟悉，因此要解释事件处理的基本概念，比如事件冒泡、捕获阶段，以及attachEvent在这些方面的不同表现。例如，attachEvent不支持事件捕获，只支持冒泡阶段，而addEventListener可以指定阶段。 另外，关于this关键字的指向问题，在attachEvent中，事件处理函数内的this指向的是window对象，而不是触发事件的元素，这与addEventListener的行为不同。这也是需要强调的一个区别，因为这在代码迁移时可能导致问题。 还要提到移除事件的方法，detachEvent，类似于removeEventListener，但同样需要注意参数的一致性。 最后，给出现代最佳实践，推荐使用addEventListener，并考虑使用polyfill或库（如jQuery）来处理旧浏览器兼容性，以确保代码的健壮性和可维护性。 检查是否有遗漏点，比如IE版本的支持范围，attachEvent的参数细节，事件处理函数的作用域问题，以及常见的错误使用案例。确保回答准确且易于理解，避免使用过于专业的术语，必要时进行解释。 总结，用户需要了解attachEvent的背景、用法、问题及替代方案，回答应涵盖这些方面，并提供实用示例和迁移建议，帮助他们解决实际问题或加深理解。</think>`attachEvent` 是早期 **Internet Explorer 浏览器（IE8及以下版本）** 中用于绑定事件处理程序的方法。它是微软在 **IE事件模型** 中实现的专有方法，与标准浏览器的 `addEventListener` 方法行为不同。以下是关键知识点： --- ### 1. 基础语法 ```javascript element.attachEvent("on" + eventName, handler); ``` - **参数**： - `eventName`: 事件名称，需以 `on` 开头（例如 `"onclick"`）。 - `handler`: 事件处理函数。 --- ### 2. 与 `addEventListener` 的区别 | 特性 | `attachEvent` (IE) | `addEventListener` (标准) | |---------------------|--------------------------------|-----------------------------------| | 事件名前缀 | 必须加 `on`（如 `"onclick"`） | 不加 `on`（如 `"click"`） | | 事件阶段 | 仅支持冒泡阶段 | 支持捕获/冒泡阶段（通过第三个参数） | | `this` 指向 | `window` 对象 | 触发事件的元素 | | 多个事件处理程序 | 执行顺序不确定 | 按绑定顺序执行 | | 移除方法 | `detachEvent` | `removeEventListener` | --- ### 3. 兼容性代码示例 ```javascript if (element.addEventListener) { // 标准浏览器 element.addEventListener("click", handler, false); } else if (element.attachEvent) { // IE8及以下 element.attachEvent("onclick", handler); } ``` --- ### 4. 注意事项 1. **`this` 指向问题** 在 `attachEvent` 中，事件处理函数内的 `this` 指向 `window`，而非触发事件的元素。需手动传递元素： ```javascript element.attachEvent("onclick", function() { handler.call(element); // 强制修正 this 指向 }); ``` 2. **事件对象** IE 中通过 `window.event` 获取事件对象，而标准浏览器通过参数传递： ```javascript function handler(e) { e = e || window.event; // 兼容写法 // 处理事件 } ``` 3. **内存泄漏风险** 在旧版本 IE 中，未正确解绑事件可能导致内存泄漏。务必使用 `detachEvent` 及时移除事件。 --- ### 5. 现代替代方案 - **优先使用 `addEventListener`**，并通过 Polyfill 或库（如 jQuery）兼容旧浏览器。 - **框架推荐**：Vue/React 等现代框架已封装事件处理，无需直接操作 `attachEvent`。 --- ### 总结 `attachEvent` 是旧版 IE 的事件绑定方法，存在诸多兼容性问题。现代开发中应使用 `addEventListener`，并通过条件判断或工具库实现跨浏览器支持。
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值