首頁 > web前端 > js教程 > JS事件在IE與FF中的差異詳細解析_javascript技巧

JS事件在IE與FF中的差異詳細解析_javascript技巧

WBOY
發布: 2016-05-16 17:13:58
原創
933 人瀏覽過

之道的易搜項目中的搜尋分類是透過JS動態產生的,每個產生的元素都要動態的新增屬性、事件。其中,新增屬性可以採用賦值的方式,這對IE和FF都是適用的。如:

     var element = document.createElement('select');

     element.id = "myselect";

上面的語句在IE和FF中都會有相同的效果,而且運作正常。但是我們創建的元素,大部分是要給其動態添加事件的,顯然,我們不能和添加屬性一樣,直接在後面打個dot,然後寫個事件名,然後後面跟著一串代碼,那樣是會報錯的。所以我們可以用如下的方法來新增事件:

首先:我們要判斷目前的瀏覽器是什麼瀏覽器,我們仍然延用先前的定義,

   if( element.attachEvent ){

    //為IE以及IE核心的瀏覽器(1)

   }else if( element.addEventListener){

     //為FF以及NS核心的瀏覽器(2)

   }

上面的if語句區塊就是幫我們完成目前瀏覽器是IE還是FF的判斷。

瀏覽器判斷出來,然後我們要做的就是把函數註冊到元素裡面。下面我們給出我們定義的一個功能函數:

   function showElementId(elmt){

     alert(elmt.id);

   }

函數功能很簡單,就是提示出參數裡面的元素的ID。

如果是IE瀏覽器,我們把如下程式碼插入上面的註解(1)處:

element.attachEvent( "onclick",function(){showElementId(elmt)});

如果是FF瀏覽器,我們把如下程式碼插入上面的註解(2)處:

var eventName = "onclick".replace(/on(.*)/i,'$1');
element.addEventListener( eventName,function(){showElementId(elmt)},false);

因為在FF中給元素註冊事件的時候,不需要事件名稱前面的“on”,所以要把on給替換掉。

好啦,如果今後各位同行在開發專案中,遇到要用JS動態為元素添加事件的時候,就可以採用上面的方法。那樣就可以避免用戶在用FF瀏覽器時候不能使用你幸苦開發的功能了。

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
最新問題
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板