解决使用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 相关文章推荐
脚本安需导入(装载)的三种模式的对比
Jun 24 Javascript
理解Javascript_09_Function与Object
Oct 16 Javascript
js 自动播放的实例代码
Nov 19 Javascript
js中AppendChild与insertBefore的用法详细解析
Dec 16 Javascript
JS与HTML结合使用marquee标签实现无缝滚动效果代码
Jul 05 Javascript
对Js OOP编程 创建对象的一些全面理解
Jul 26 Javascript
基于SpringMVC+Bootstrap+DataTables实现表格服务端分页、模糊查询
Oct 30 Javascript
巧用canvas
Jan 21 Javascript
react在安卓中输入框被手机键盘遮挡问题的解决方法
Sep 03 Javascript
微信小程序实现留言板(Storage)
Nov 02 Javascript
vue项目动态设置页面title及是否缓存页面的问题
Nov 08 Javascript
vue中h5端打开app(判断是安卓还是苹果)
Feb 26 Vue.js
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/02/28 PHP
php基于dom实现读取图书xml格式数据的方法
2017/02/03 PHP
php正则表达式基本知识与应用详解【经典教程】
2017/04/17 PHP
javascript 动态数据下的锚点错位问题解决方法
2008/12/24 Javascript
jquery插件jTimer(jquery定时器)使用方法
2013/12/23 Javascript
Javascript遍历table中的元素示例代码
2014/07/08 Javascript
jquery访问ashx文件示例代码
2014/08/11 Javascript
教你JS中的运算符乘方、开方及变量格式转换
2016/08/09 Javascript
Bootstrap页面缩小变形的快速解决办法
2017/02/03 Javascript
利用canvas实现的加载动画效果实例代码
2017/07/05 Javascript
浅谈node.js 命令行工具(cli)
2018/05/10 Javascript
Vue下拉框回显并默认选中随机问题
2018/09/06 Javascript
vue开发拖拽进度条滑动组件
2019/09/21 Javascript
Vue开发环境跨域访问问题
2020/01/22 Javascript
jQuery 函数实例分析【函数声明、函数表达式、匿名函数等】
2020/05/19 jQuery
Python中的左斜杠、右斜杠(正斜杠和反斜杠)
2016/08/30 Python
Python自动化运维和部署项目工具Fabric使用实例
2016/09/18 Python
Python实现向服务器请求压缩数据及解压缩数据的方法示例
2017/06/09 Python
Flask框架实现给视图函数增加装饰器操作示例
2018/07/16 Python
解决使用pycharm提交代码时冲突之后文件丢失找回的方法
2018/08/05 Python
Python 实现某个功能每隔一段时间被执行一次的功能方法
2018/10/14 Python
浅谈pandas用groupby后对层级索引levels的处理方法
2018/11/06 Python
使用Python向C语言的链接库传递数组、结构体、指针类型的数据
2019/01/29 Python
OpenCV HSV颜色识别及HSV基本颜色分量范围
2019/03/22 Python
Python使用sklearn库实现的各种分类算法简单应用小结
2019/07/04 Python
Django项目主urls导入应用中views的红线问题解决
2019/08/10 Python
python 6行代码制作月历生成器
2020/09/18 Python
canvas 下载二维码和图片加水印的方法
2018/03/21 HTML / CSS
专题民主生活会对照检查材料思想汇报
2014/09/29 职场文书
2014年音乐教师工作总结
2014/12/03 职场文书
企业宣传稿范文
2015/07/23 职场文书
CSS3 实现NES游戏机的示例代码
2021/04/21 HTML / CSS
Goland使用Go Modules创建/管理项目的操作
2021/05/06 Golang
教你在 Java 中实现 Dijkstra 最短路算法的方法
2022/04/08 Java/Android
利用 Python 的 Pandas和 NumPy 库来清理数据
2022/04/13 Python
Redis数据同步之redis shake的实现方法
2022/04/21 Redis