解决使用attachEvent函数时，this指向被绑定的元素的问题的方法
更新时间：2007年08月13日 19:14:35 作者：
使用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>
我给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>
相关文章
ion content 滚动到底部会遮住一部分视图的快速解决方法
本文给大家带来了ion content 滚动到底部会遮住一部分视图的快速解决方法，其实解决方法超简单的，只要在你的controller里面预先注入$ionicScrollDelegate就可以了，感兴趣的朋友通过本文一起学习吧2016-09-09
this是javascript的一个关键字，随着函数使用场合不同，this的值会发生变化。这篇文章主要介绍了JavaScript中的this引用的相关资料,非常不错，需要的朋友可以参考下2016-08-08
javascript中的undefined 与 null 的区别 补充篇
在Javascript中有两个值用来代表类似空值的概念，undefined和null，这两个很容易被混淆，他们表示的是两个不同的概念。2010-03-03
这篇文章主要为大家详细介绍了BootStrap入门学习第一篇，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-08-08
这篇文章主要介绍了如何让每个Http请求都自动带上token问题，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2023-03-03
这篇文章主要为大家详细介绍了js实现拖动缓动效果，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2020-01-01
这篇文章主要介绍了JavaScript中的迭代器和生成器详解,本文讲解了迭代器、声明自定义迭代器、生成器：一种更好的方式来构建迭代器、生成器高级特性等内容,需要的朋友可以参考下2014-10-10
在我们开发网页的时候偶尔会有需要用户录音的情况,下面这篇文章主要给大家介绍了关于JS如何获取浏览器声音、麦克风以及通知权限的相关资料,文中通过代码介绍的非常详细,需要的朋友可以参考下2024-03-03
本文主要介绍了Javascript的基本数据类型和数据类型的转换规则。具有很好的参考价值，需要的朋友可以看下2016-12-12
Javascript实现的分页函数...2007-02-02
最新评论