解决使用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 相关文章推荐
JavaScript TO HTML 转换
Jun 26 Javascript
为什么要在引入的css或者js文件后面加参数的详细讲解
May 03 Javascript
jquery如何判断某元素是否具备指定的样式
Nov 05 Javascript
如何通过javascript操作web控件的自定义属性
Nov 25 Javascript
JavaScript函数参数使用带参数名的方式赋值传入的方法
Mar 19 Javascript
超级给力的JavaScript的React框架入门教程
Jul 02 Javascript
JavaScript继承学习笔记【新手必看】
May 10 Javascript
Angular2中select用法之设置默认值与事件详解
May 07 Javascript
移动端H5页面返回并刷新页面(BFcache)的方法
Nov 06 Javascript
vue使用websocket的方法实例分析
Jun 22 Javascript
基于vue写一个全局Message组件的实现
Aug 15 Javascript
微信小程序中data-key属性之数据传输(经验总结)
Aug 22 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使用PDO操作数据库的乱码问题解决方法
2016/04/08 PHP
一段好玩的JavaScript代码
2006/12/01 Javascript
Javascript 验证上传图片大小[客户端]
2009/08/01 Javascript
javascript判断chrome浏览器的方法
2014/03/26 Javascript
AngularJS入门教程之Hello World!
2014/12/06 Javascript
JavaScript日期类型的一些用法介绍
2015/03/02 Javascript
javascript制作2048游戏
2015/03/30 Javascript
jquery实现仿Flash的横向滑动菜单效果代码
2015/09/17 Javascript
JS实现带有3D立体感的银灰色竖排折叠菜单代码
2015/10/20 Javascript
基于Jquery插件实现跨域异步上传文件功能
2016/04/26 Javascript
Bootstrap table简单使用总结
2017/02/15 Javascript
vue货币过滤器的实现方法
2017/04/01 Javascript
浅谈node.js 命令行工具(cli)
2018/05/10 Javascript
深入Vue-Router路由嵌套理解
2018/08/13 Javascript
微信小程序实现展示评分结果功能
2019/02/15 Javascript
[00:37]2016完美“圣”典风云人物:AMS宣传片
2016/12/06 DOTA
[08:17]Ti9 现场cosplay
2019/09/10 DOTA
[01:11:37]完美世界DOTA2联赛PWL S2 SZ vs FTD.C 第一场 11.19
2020/11/19 DOTA
python中随机函数random用法实例
2015/04/30 Python
Python2中的raw_input() 与 input()
2015/06/12 Python
python类中super()和__init__()的区别
2016/10/18 Python
Python实现句子翻译功能
2017/11/14 Python
Python+OpenCV+图片旋转并用原底色填充新四角的例子
2019/12/12 Python
利用python如何实现猫捉老鼠小游戏
2020/12/04 Python
HTML5网页音乐播放器的示例代码
2017/11/09 HTML / CSS
澳大利亚家具和家居用品在线商店:Interiors Online
2018/03/05 全球购物
大学学雷锋活动总结
2014/06/26 职场文书
高中学校对照检查材料
2014/08/31 职场文书
爱护公物演讲稿
2014/09/09 职场文书
劳动争议和解协议书范本
2014/11/20 职场文书
刑事附带民事上诉状
2015/05/23 职场文书
公司宣传语大全
2015/07/13 职场文书
2016年党风廉政建设承诺书
2016/03/25 职场文书
简单实现一个手持弹幕功能+文字抖动特效
2021/03/31 HTML / CSS
Redis中缓存穿透/击穿/雪崩问题和解决方法
2021/12/04 Redis
Python各协议下socket黏包问题原理
2022/04/12 Python