解決使用attachEvent函數(shù)時，this指向被綁定的元素的問題的方法
更新時間：2007年08月13日 19:14:35 作者：
使用attachEvent對同一事件進行多次綁定，這是解決事件函數(shù)定義沖突的重要方法。但是在IE中，函數(shù)內的this指針并沒有指向被綁定元素，而是function對象，在應用中，這是很難受的一件事，如果試圖用局部變量傳送元素，會因為閉包而引起內存泄漏。那么，我們應該如何解決這一難題呢？
我給Function添加了原型方法“bindNode”，在這個方法里，根據傳送過來的元素，進行全局性存儲轉換，然后返回經過封裝的函數(shù)，使用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
//使用了全局數(shù)組__bindNodes，通過局部變量iNodeItem進行跨函數(shù)傳值，如果直接傳送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”，在這個方法里，根據傳送過來的元素，進行全局性存儲轉換，然后返回經過封裝的函數(shù)，使用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
//使用了全局數(shù)組__bindNodes，通過局部變量iNodeItem進行跨函數(shù)傳值，如果直接傳送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 滾動到底部會遮住一部分視圖的快速解決方法
本文給大家?guī)砹薸on content 滾動到底部會遮住一部分視圖的快速解決方法，其實解決方法超簡單的，只要在你的controller里面預先注入$ionicScrollDelegate就可以了，感興趣的朋友通過本文一起學習吧2016-09-09
this是javascript的一個關鍵字，隨著函數(shù)使用場合不同，this的值會發(fā)生變化。這篇文章主要介紹了JavaScript中的this引用的相關資料,非常不錯，需要的朋友可以參考下2016-08-08
javascript中的undefined 與 null 的區(qū)別 補充篇
在Javascript中有兩個值用來代表類似空值的概念，undefined和null，這兩個很容易被混淆，他們表示的是兩個不同的概念。2010-03-03
這篇文章主要為大家詳細介紹了BootStrap入門學習第一篇，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-08-08
這篇文章主要介紹了如何讓每個Http請求都自動帶上token問題，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2023-03-03
這篇文章主要為大家詳細介紹了js實現(xiàn)拖動緩動效果，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2020-01-01
這篇文章主要介紹了JavaScript中的迭代器和生成器詳解,本文講解了迭代器、聲明自定義迭代器、生成器：一種更好的方式來構建迭代器、生成器高級特性等內容,需要的朋友可以參考下2014-10-10
在我們開發(fā)網頁的時候偶爾會有需要用戶錄音的情況,下面這篇文章主要給大家介紹了關于JS如何獲取瀏覽器聲音、麥克風以及通知權限的相關資料,文中通過代碼介紹的非常詳細,需要的朋友可以參考下2024-03-03
詳解Javascript數(shù)據類型的轉換規(guī)則
本文主要介紹了Javascript的基本數(shù)據類型和數(shù)據類型的轉換規(guī)則。具有很好的參考價值，需要的朋友可以看下2016-12-12
Javascript實現(xiàn)的分頁函數(shù)...2007-02-02