解决使用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 相关文章推荐
鼠标滚轮改变图片大小的示例代码
Nov 20 Javascript
JavaScript通过正则表达式实现表单验证电话号码
Mar 07 Javascript
延时加载JavaScript代码提高速度
Dec 27 Javascript
Javascript字符串常用方法详解
Jul 21 Javascript
利用原生js和jQuery实现单选框的勾选和取消操作的方法
Sep 04 Javascript
jQuery实现链接的title快速出现的方法
Feb 20 Javascript
Angular中ng-bind和ng-model的区别实例详解
Apr 10 Javascript
JavaScript中click和onclick本质区别与用法分析
Jun 07 Javascript
基于Angularjs-router动态改变Title值的问题
Aug 30 Javascript
谈谈为什么你的 JavaScript 代码如此冗长
Jan 30 Javascript
vue+vant-UI框架实现购物车的复选框全选和反选功能
Nov 05 Javascript
详解关于Vue单元测试的几个坑
Apr 26 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生成带有雪花背景的验证码
2006/10/09 PHP
php四种基础算法代码实例
2013/10/29 PHP
PHP封装的一个支持HTML、JS、PHP重定向的多功能跳转函数
2014/06/19 PHP
php链表用法实例分析
2015/07/09 PHP
PHP mysql事务问题实例分析
2016/01/18 PHP
php strftime函数获取日期时间(switch用法)
2018/05/16 PHP
javascript 基础篇3 类,回调函数,内置对象,事件处理
2012/03/14 Javascript
jQuery选择器之基本选择器与层次选择器
2015/03/03 Javascript
jquery预加载图片的方法
2015/05/27 Javascript
JS实现的仿淘宝交易倒计时效果
2015/11/27 Javascript
详解jQuery lazyload 懒加载
2016/12/19 Javascript
使用openSpeDiv方法实现Ecshop登录弹窗框效果
2017/03/13 Javascript
vue实现底部菜单功能
2018/07/24 Javascript
Angular使用Restful的增删改
2018/12/28 Javascript
浅析JavaScript异步代码优化
2019/03/18 Javascript
深入学习JavaScript 高阶函数
2019/06/11 Javascript
JavaScript常用内置对象用法分析
2019/07/09 Javascript
jquery中attr、prop、data区别与用法分析
2019/09/25 jQuery
JS eval代码快速解密实例解析
2020/04/23 Javascript
vue+element实现图片上传及裁剪功能
2020/06/29 Javascript
基于Electron实现桌面应用开发代码实例
2020/07/07 Javascript
解决tensorflow测试模型时NotFoundError错误的问题
2018/07/27 Python
Python 使用PIL中的resize进行缩放的实例讲解
2018/08/03 Python
python 有效的括号的实现代码示例
2019/11/11 Python
windows环境中利用celery实现简单任务队列过程解析
2019/11/29 Python
用python批量移动文件
2021/01/14 Python
西班牙品牌鞋子、服装和配饰在线商店:Esdemarca
2021/02/17 全球购物
广州一家公司的.NET面试题
2016/06/11 面试题
旅游管理毕业生自荐信
2013/11/05 职场文书
银行办理业务介绍信
2014/01/18 职场文书
令人印象深刻的自荐信
2014/05/25 职场文书
六查六看心得体会
2014/10/14 职场文书
小学生五一劳动节演讲稿
2015/03/18 职场文书
餐饮店长岗位职责
2015/04/14 职场文书
乡镇安全生产月活动总结
2015/05/08 职场文书
mysql查询的控制语句图文详解
2021/04/11 MySQL