解决使用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 相关文章推荐
Gird组件 Part-3:范例RSSFeed Viewer
Mar 10 Javascript
修改jquery.lazyload.js实现页面延迟载入
Dec 22 Javascript
html文件中jquery与velocity变量中的$冲突的解决方法
Nov 01 Javascript
javascript数组遍历for与for in区别详解
Dec 04 Javascript
JS实现可点击展开与关闭的左侧广告代码
Sep 02 Javascript
flexslider.js实现移动端轮播
Feb 05 Javascript
求js数组的最大值和最小值的四种方法
Mar 03 Javascript
从零开始学习Node.js系列教程二:文本提交与显示方法
Apr 13 Javascript
微信小程序中使用wxss加载图片并实现动画效果
Aug 13 Javascript
一秒学会微信小程序制作table表格
Feb 14 Javascript
JavaScript React如何修改默认端口号方法详解
Jul 28 Javascript
vue实现登录功能
Dec 31 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
第四节 构造函数和析构函数 [4]
2006/10/09 PHP
PHP strtr() 函数使用说明
2008/11/21 PHP
php获取本地图片文件并生成xml文件输出具体思路
2013/04/27 PHP
PHP字符串的连接的简单实例
2013/12/30 PHP
删除html标签得到纯文本可处理嵌套的标签
2014/04/28 PHP
PHP的MVC模式实现原理分析(一相简单的MVC框架范例)
2014/04/29 PHP
PHP使用PDO访问oracle数据库的步骤详解
2017/09/29 PHP
小议Function.apply() 之一------(函数的劫持与对象的复制)
2006/11/30 Javascript
javascript获取下拉列表框当中的文本值示例代码
2013/07/31 Javascript
js给页面加style无效果的解决方法
2014/01/20 Javascript
JavaScript使用指针操作实现约瑟夫问题实例
2015/04/07 Javascript
详解js图片轮播效果实现原理
2015/12/17 Javascript
JS实现“隐藏与显示”功能(多种方法)
2016/11/24 Javascript
Vue.js对象转换实例
2017/06/07 Javascript
JavaScript面向对象的程序设计(犯迷糊的小羊)
2018/05/27 Javascript
记一次webpack3升级webpack4的踩坑经历
2018/06/12 Javascript
Vue配合iView实现省市二级联动的示例代码
2018/07/27 Javascript
Vue开发之watch监听数组、对象、变量操作分析
2019/04/25 Javascript
详解如何给React-Router添加路由页面切换时的过渡动画
2019/04/25 Javascript
微信小程序封装的HTTP请求示例【附升级版】
2019/05/11 Javascript
layUI实现前端分页和后端分页
2019/07/27 Javascript
JavaScript前端实现压缩图片功能
2020/03/06 Javascript
React 条件渲染最佳实践小结(7种)
2020/09/27 Javascript
提升Python程序运行效率的6个方法
2015/03/31 Python
python logging重复记录日志问题的解决方法
2018/07/12 Python
python 将列表里的字典元素合并为一个字典实例
2020/09/01 Python
pyx文件 生成pyd 文件用于 cython调用的实现
2021/03/04 Python
一款纯css3实现的竖形二级导航的实例教程
2014/12/11 HTML / CSS
英国最大的女性服装零售商:Dorothy Perkins
2017/03/30 全球购物
Android面试题及答案
2015/09/04 面试题
什么是静态路由?什么是动态路由?各自的特点是什么?
2015/09/16 面试题
面临毕业的毕业生自荐书范文
2014/02/05 职场文书
2015年见习期个人工作总结
2015/05/28 职场文书
党内外群众意见范文
2015/06/02 职场文书
2015国庆节宣传语
2015/07/14 职场文书
导游词之神仙居景区
2019/11/15 职场文书