跨瀏覽器的事件處理程序（添加，刪除，觸發器）

我有點困惑，當我嘗試在IE7中，IE9，Chrome瀏覽器18，火狐12綁定一個處理函數的事件（像click）它的工作很好，但是當我嘗試刪除事件的相關功能時，只有IE7和Firefox才能夠卸載該功能。這是我使用的代碼，我做錯了什麼？跨瀏覽器的事件處理程序（添加，刪除，觸發器）

bindEvent:function(el,evtType,fn){ 

      if(el.addEventListener){ 
       el.addEventListener(evtType,fn,false); 
      } else { 
       if(el.attachEvent){ 


        var _el=el; 
        var f = function(){fn.call(_el,window.event);} 
        el.attachEvent('on'+evtType, f); 
        el[fn.toString()+evtType]=f; 


        //el.attachEvent('on'+evtType,fn) ; 

       } else { 

        el['on'+evtType]=fn; 
       } 
      } 

    return el; 

    }, 

    removeEvent: function(el,evtType, fn) { 

     if(el.removeEventListener){ 
      el.removeEventListener(evtType, fn, false); 
     }else if(el.detachEvent){ 
      el.detachEvent('on'+evtType,el[fn.toString()+evtType]); 
      el[fn.toString()+evtType]=null; 


     }else{ 

      el['on'+evtType]=function(){}; 

     } 

     return el; 
    }

我的代碼來測試此是：

var a = document.getElementById('just_a_div'); 
bindEvent(a,'click',function(){alert('Hi There');});

，並設法去掉我用幾乎相同：

removeEvent(a,'click',function(){alert('Hi There');});

任何意見或一些預製的片段，可以做這項任務有效地在所有瀏覽器上？希望能出現一個解決方案，永遠感激。

來源

2012-04-20 Josh Guzman

爲子孫後代的OP代碼似乎是基於什麼作者：John Resig的2005年9月有代碼中的註釋一些實質性的批評，特別是那些與內存泄漏，應考慮（例如那些由[*道格拉斯*]（http://ejohn.org/projects/flexible-javascript-events/#comment-5882））。他們沒有在帖子中解決。另請參閱在批判[*什麼是不對的廣泛使用AJAX事件處理程序的註冊碼？*]（http://pankaj-k.net/weblog/2007/07/what_is_wrong_with_this_widely.html）。 – RobG 2014-12-15 06:40:57

你的代碼在my example在IE8，Firefox和Chrome（該事件將在五秒後會被釋放）。也許你的測試用例有錯誤？你能告訴我們你的測試用具嗎？

=== UPDTAE ===

在javascript中功能是絕不相同也當它們具有相同的參數和內容。試試：alert(function(){alert('Hi There');} == function(){alert('Hi There');});結果是false。

對功能的敬畏是相等的，如果他們對同樣的功能感到敬畏的話。所以var fn = function() { alert('clicked'); }; alert(fn == fn);是true。

您應該使用相同的引用bindEvent和removeEvent函數中的函數，如my example。

來源

2012-04-20 06:22:20 scessor

關於爲什麼5秒的任何想法？ – 2012-04-20 13:17:23

哦，我沒有探索你的代碼，這是一個超時!!，對不起我的錯誤。 – 2012-04-20 13:28:40

@ codef0rmer我打電話的方式是：bindEvent（ '點擊'，函數（）{回報 '嗨';}）;但是當我嘗試刪除它可以完成，removeEvent（'click'，function（）{return'Hi';}）; – 2012-04-20 19:59:57

It`sa有點難以支持所有瀏覽器的純JavaScript代碼，太多更好的辦法是使用JavaScript框架，我認爲最好的一個是JQuery &當然還有很多其他框架的哪些已經被設計用於不同的目的。

來源

2012-04-20 05:45:59

jQuery並未完全實現事件處理的本機JavaScript行爲。使用jQuery，您可以爲相同對象的相同事件類型多次註冊相同的函數。但'addEventListener'的本地行爲不允許這樣做。 – 2012-04-20 06:15:22

@AndrewD。但是，問題是我只需要將函數附加到對象的事件上。 – 2012-04-20 13:19:05

使用jQuery的跨瀏覽器支持。您只需使用.bind附加一個事件並使用unbind將其分開即可。

來源

2012-04-20 06:23:13 codef0rmer

這正是我的目標：不要使用Jquery，我只需要將函數附加到對象的事件。 – 2012-04-20 13:15:57

跨瀏覽器的事件處理程序（添加，刪除，觸發器）

回答

相關問題