解决使用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 相关文章推荐
基于prototype的validation.js发布2.3.4新版本,让你彻底脱离表单验证的烦恼
Dec 06 Javascript
如何使用jQUery获取选中radio对应的值(一句代码)
Jun 03 Javascript
js中点击空白区域时文本框与隐藏层的显示与影藏问题
Aug 26 Javascript
基于jquery实现图片上传本地预览功能
Jan 08 Javascript
获取IE浏览器Cookie信息的方法
Jan 23 Javascript
教你用十行node.js代码读取docx的文本
Mar 08 Javascript
详解Weex基于Vue2.0开发模板搭建
Mar 20 Javascript
浅析JS中回调函数及用法
Jul 25 Javascript
记录一篇关于redux-saga的基本使用过程
Aug 18 Javascript
element UI upload组件上传附件格式限制方法
Sep 04 Javascript
JavaScript中的this原理及6种常见使用场景详解
Feb 14 Javascript
JS实现手风琴特效
Nov 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-CGI进程CPU 100% 与 file_get_contents 函数的关系分析
2011/08/15 PHP
php 短链接算法收集与分析
2011/12/30 PHP
PHP 快速排序算法详解
2014/11/10 PHP
PHP模板引擎Smarty中的保留变量用法分析
2016/04/11 PHP
PHP实现的最大正向匹配算法示例
2017/12/19 PHP
使用tp框架和SQL语句查询数据表中的某字段包含某值
2019/10/18 PHP
用Greasemonkey 脚本收藏网站会员信息到本地
2009/10/26 Javascript
javascript 判断整数方法分享
2014/12/16 Javascript
百度UEditor编辑器如何关闭抓取远程图片功能
2015/03/03 Javascript
jQuery实现hover合成事件的方法
2015/08/06 Javascript
微信小程序 Flex布局详解
2016/10/09 Javascript
原生JavaScript制作计算器
2016/10/16 Javascript
Bootstrap模态框(Modal)实现过渡效果
2017/03/17 Javascript
Javascript es7中比较实用的两个方法示例
2017/07/21 Javascript
vue树形结构获取键值的方法示例
2018/06/21 Javascript
基于vue展开收起动画的示例代码
2018/07/05 Javascript
原生js实现移动端Touch轮播图的方法步骤
2019/01/03 Javascript
jQuery判断自定义属性data-val用法示例
2019/01/07 jQuery
JS数组索引检测中的数据类型问题详解
2021/01/11 Javascript
[47:04]LGD vs infamous Supermajor小组赛D组 BO3 第二场 6.3
2018/06/04 DOTA
[42:23]完美世界DOTA2联赛PWL S3 Forest vs Rebirth 第二场 12.10
2020/12/13 DOTA
用Python中的字典来处理索引统计的方法
2015/05/05 Python
Python装饰器基础详解
2016/03/09 Python
pycharm执行python时,填写参数的方法
2018/10/29 Python
PyQt5 实现给窗口设置背景图片的方法
2019/06/13 Python
pyqt5实现绘制ui,列表窗口,滚动窗口显示图片的方法
2019/06/20 Python
Jupyter 无法下载文件夹如何实现曲线救国
2020/04/22 Python
Keras中 ImageDataGenerator函数的参数用法
2020/07/03 Python
python如何设置静态变量
2020/09/07 Python
Bonprix法国:时尚、鞋子、家居
2020/12/29 全球购物
学生发电厂实习自我鉴定
2013/09/22 职场文书
《厄运打不垮的信念》教学反思
2014/04/13 职场文书
《画》教学反思
2014/04/14 职场文书
演讲稿的写法
2014/05/19 职场文书
卖车协议书范本4篇
2014/10/01 职场文书
2014年副班长工作总结
2014/12/10 职场文书