解决使用attachEvent函数时,this指向被绑定的元素的问题的方法


Posted in Javascript onAugust 13, 2007

使用attachEvent对同一事件进行多次绑定,这是解决事件函数定义冲突的重要方法。但是在IE中,函数内的this指针并没有指向被绑定元素,而是function对象,在应用中,这是很难受的一件事,如果试图用局部变量传送元素,会因为闭包而引起内存泄漏。那么,我们应该如何解决这一难题呢?

   我给Function添加了原型方法“bindNode”,在这个方法里,根据传送过来的元素,进行全局性存储转换,然后返回经过封装的函数,使用call方法来进行属主转换。

<html>
<body>
<button id=btTest>test</button>
</body>
</html>
<script>
if(!document.all){
   HTMLElement.prototype.attachEvent=function(sType,foo){
       this.addEventListener(sType.slice(2),foo,false)
   }
}
Function.prototype.bindNode=function(oNode){
   var foo=this,iNodeItem

   //使用了全局数组__bindNodes,通过局部变量iNodeItem进行跨函数传值,如果直接传送oNode,也将造成闭包
   if(window.__bindNodes==null)
       __bindNodes=[]
   __bindNodes.push(oNode)
   iNodeItem=__bindNodes.length-1
   oNode=null
   return function(e){
       foo.call(__bindNodes[iNodeItem],e||event)
   }
}
abc()
function abc(){
   var bt=document.getElementById("btTest")
   bt.attachEvent("onclick",function(){

       //如果不经过bindNode处理,下面的结果将是undefined
       alert(this.tagName)
   }.bindNode(bt))
   bt=null
}
</script>

Javascript 相关文章推荐
Pro JavaScript Techniques学习笔记
Dec 28 Javascript
jQuery AJAX实现调用页面后台方法和web服务定义的方法分享
Mar 01 Javascript
JavaScript通过Date-Mask将日期转换成字符串的方法
Jun 04 Javascript
JS解决iframe之间通信和自适应高度的问题
Aug 24 Javascript
jquery使用EasyUI Tree异步加载JSON数据(生成树)
Feb 11 Javascript
js中开关变量使用实例
Feb 24 Javascript
AngularJS使用ocLazyLoad实现js延迟加载
Jul 05 Javascript
Chrome调试折腾记之JS断点调试技巧
Sep 11 Javascript
react-router4按需加载(踩坑填坑)
Jan 06 Javascript
js实现图片粘贴到网页
Dec 06 Javascript
在weex中愉快的使用scss的方法步骤
Jan 02 Javascript
微信小程序纯文本实现@功能
Apr 08 Javascript
Track Image Loading效果代码分析
Aug 13 #Javascript
不错的JS中变量相关的细节分析
Aug 13 #Javascript
javascript-TreeView父子联动效果保持节点状态一致
Aug 12 #Javascript
TopList标签和JavaScript结合两例
Aug 12 #Javascript
Javascript-Mozilla和IE中的一个函数直接量的问题分析
Aug 12 #Javascript
IE和Mozilla的兼容性汇总event
Aug 12 #Javascript
收藏Javascript中常用的55个经典技巧
Aug 12 #Javascript
You might like
php定时删除文件夹下文件(清理缓存文件)
2013/01/23 PHP
Session 失效的原因汇总及解决丢失办法
2015/09/30 PHP
PHP 7.4 新语法之箭头函数实例详解
2019/05/09 PHP
对象特征检测法判断浏览器对javascript对象的支持
2009/07/25 Javascript
一个报数游戏js版(约瑟夫环问题)
2010/08/05 Javascript
jQuery中的$.ajax()方法应用
2014/05/06 Javascript
jQuery Validate表单验证入门学习
2015/12/18 Javascript
基于javascript实现简单的抽奖系统
2020/04/15 Javascript
javascript事件处理模型实例说明
2016/05/31 Javascript
深入浅析knockout源码分析之订阅
2016/07/12 Javascript
node.js爬虫爬取拉勾网职位信息
2017/03/14 Javascript
ReactJs设置css样式的方法
2017/06/08 Javascript
Vue计算属性的使用
2017/08/04 Javascript
微信小程序bindtap事件与冒泡阻止详解
2019/08/08 Javascript
如何利用JavaScript编写一个格斗小游戏
2021/01/06 Javascript
[01:11:27]2018DOTA2亚洲邀请赛小组赛 A组加赛 Newbee vs Optic
2018/04/03 DOTA
python在windows下实现ping操作并接收返回信息的方法
2015/03/20 Python
python实现读取并显示图片的两种方法
2017/01/13 Python
python多进程和多线程究竟谁更快(详解)
2017/05/29 Python
在python里协程使用同步锁Lock的实例
2019/02/19 Python
django-初始配置(纯手写)详解
2019/07/30 Python
Python3.0 实现决策树算法的流程
2019/08/08 Python
Python importlib动态导入模块实现代码
2020/04/16 Python
python smtplib发送多个email联系人的实现
2020/10/09 Python
英国床垫在线:Mattress Online
2016/12/07 全球购物
医疗保健专业人士购物网站:Scrubs & Beyond
2017/02/08 全球购物
英国领先的品牌珠宝和配件供应商:Acotis Jewellery
2018/03/07 全球购物
哥伦比亚加拿大官网:Columbia Sportswear Canada
2020/09/07 全球购物
linux面试题参考答案(10)
2016/10/26 面试题
介绍一下except的用法和作用
2015/01/22 面试题
英文版区域经理求职信
2013/10/23 职场文书
人事主管的岗位职责
2013/11/16 职场文书
小型女装店的创业计划书
2014/01/09 职场文书
网络营销策划方案
2014/06/04 职场文书
党员自我对照检查材料
2014/08/19 职场文书
上班旷工检讨书
2015/08/15 职场文书