js的一些兼容性寫法


①添加事件方法

addHandler:function(element,type,handler){

     if (element.addEventListener){ //檢測是否為DOM2級方法
         element.addEventListener(type, handler,  false );
     } else  if  (element.attachEvent){ //檢測是否為IE級方法
         element.attachEvent( "on"  + type, handler);
     else  { //檢測是否為DOM0級方法
         element[ "on"  + type] = handler;
     }
}

②移除之前添加的事件方法

removeHandler: function (element, type, handler){
        if  (element.removeEventListener){
            element.removeEventListener(type, handler,  false );
        else  if  (element.detachEvent){
            element.detachEvent( "on"  + type, handler);
        else  {
            element[ "on"  + type] =  null ;
        }
    }
 

③獲取事件及事件對象目標

//獲取事件對象的兼容性寫法
  getEvent:  function (event){
      return  event ? event : window.event;
  },
  //獲取事件對象目標的兼容性寫法
  getTarget:  function (event){
      return  event.target || event.srcElement;
  }

④阻止瀏覽器默認事件的兼容性寫法

preventDefault:  function (event){
         if  (event.preventDefault){
             event.preventDefault();
         else  {
             event.returnValue =  false ;
         }
     }

⑤阻止事件冒泡的兼容性寫法

stopPropagation:  function (event){
         if  (event.stopPropagation){
             event.stopPropagation();
         else  {
             event.cancelBubble =  true ;
         }
     }

⑥mouseover和mouseout 事件才包含的獲取相關元素的方法

//mouseover和mouseout 事件才包含的獲取相關元素的方法
getRelatedTarget:  function (event){
     if  (event.relatedTarget){
         return  event.relatedTarget;
     else  if  (event.toElement){
         return  event.toElement;
     else  if  (event.fromElement){
         return  event.fromElement;
     else  {
         return  null ;
     }
}

⑦鼠標滾輪判斷

     /*對於mousedown 和mouseup 事件來說,則在其event 對象存在一個button 屬性,
表示按下或釋放的按鈕。DOM的button 屬性可能有如下3 個值:0 表示主鼠標按鈕,1 表示中間的鼠
標按鈕(鼠標滾輪按鈕),2 表示次鼠標按鈕。在常規的設置中,主鼠標按鈕就是鼠標左鍵,而次鼠標
按鈕就是鼠標右鍵。
IE8 及之前版本也提供了button 屬性,但這個屬性的值與DOM 的button 屬性有很大差異。
 0:表示沒有按下按鈕。
 1:表示按下了主鼠標按鈕。
 2:表示按下了次鼠標按鈕。
 3:表示同時按下了主、次鼠標按鈕。
 4:表示按下了中間的鼠標按鈕。
 5:表示同時按下了主鼠標按鈕和中間的鼠標按鈕。
 6:表示同時按下了次鼠標按鈕和中間的鼠標按鈕。
 7:表示同時按下了三個鼠標按鈕。*/
getButton:  function (event){
     if  (document.implementation.hasFeature( "MouseEvents" "2.0" )){
         return  event.button;
     else  {
         switch (event.button){
             case  0:
             case  1:
             case  3:
             case  5:
             case  7:
             return  0;
             case  2:
             case  6:
             return  2;
             case  4:
             return  1;
         }
     }
}

⑧能夠取得鼠標滾輪增量值(delta)的方法

getWheelDelta:  function (event){
     if  (event.wheelDelta){
         return  (client.engine.opera && client.engine.opera < 9.5 ?
             -event.wheelDelta : event.wheelDelta);
     else  {
         return  -event.detail * 40; //firefox中的值為+3表示向上滾,-3表示向下滾
     }
}

⑨跨瀏覽器的方式取得字符編碼

getCharCode:  function (event){
     if  ( typeof  event.charCode ==  "number" ){
         return  event.charCode;
     else  {
         return  event.keyCode;
     }
}

⑩訪問剪貼板中的數據

getClipboardText:  function (event){
         var  clipboardData = (event.clipboardData || window.clipboardData);
         return  clipboardData.getData( "text" );
     }

11.設置剪貼板中的數據

setClipboardText:  function (event, value){
         if  (event.clipboardData){
             return  event.clipboardData.setData( "text/plain" , value);
         else  if  (window.clipboardData){
             return  window.clipboardData.setData( "text" , value);
         }
     }


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM