解決使用attachEvent函數(shù)時(shí)，this指向被綁定的元素的問(wèn)題的方法

2019-11-21 01:59:08

字體：大中小

供稿：網(wǎng)友

使用attachEvent對(duì)同一事件進(jìn)行多次綁定，這是解決事件函數(shù)定義沖突的重要方法。但是在IE中，函數(shù)內(nèi)的this指針并沒(méi)有指向被綁定元素，而是function對(duì)象，在應(yīng)用中，這是很難受的一件事，如果試圖用局部變量傳送元素，會(huì)因?yàn)殚]包而引起內(nèi)存泄漏。那么，我們應(yīng)該如何解決這一難題呢？

   我給Function添加了原型方法“bindNode”，在這個(gè)方法里，根據(jù)傳送過(guò)來(lái)的元素，進(jìn)行全局性存儲(chǔ)轉(zhuǎn)換，然后返回經(jīng)過(guò)封裝的函數(shù)，使用call方法來(lái)進(jìn)行屬主轉(zhuǎn)換。

<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

   //使用了全局?jǐn)?shù)組__bindNodes，通過(guò)局部變量iNodeItem進(jìn)行跨函數(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(){

       //如果不經(jīng)過(guò)bindNode處理，下面的結(jié)果將是undefined
       alert(this.tagName)
   }.bindNode(bt))
   bt=null
}
</script>

上一篇：根據(jù)地區(qū)不同顯示時(shí)間的javascript代碼

下一篇：Track Image Loading效果代碼分析