title: js事件兼容寫法
date: 2017-11-16 21:58:30
tags:

js文件下載：<font style="color: blue;">https://github.com/liuyydi/public</font>

<font style="color:#8d0000;">綁定事件兼容各個瀏覽器的寫法</font>

<font style = "color: #8d0080;">參數(shù)：</font>

<font style="color: #000088;">element：</font>代表要綁定事件的元素
<font style="color: #000088;">type：</font>要綁定的事件名，(不含“on”)
<font style="color: #000088;">fn：</font>綁定事件的函數(shù)

    function addEvent(element,type,fn){
        if(element.addEventListener){
            element.addEventListener(type,fn,true);
        }else if(element.attachEvent){
            element.attachEvent("on"+type,fn);
        }else{
            element["on"+type]=fn;
        }
    }

<font style="color:#8d0000;">移除事件兼容各個瀏覽器的寫法</font>

<font style = "color: #8d0080;">參數(shù)：</font>

<font style="color: #000088;">element：</font>代表要移除事件的元素
<font style="color: #000088;">type：</font>要要移除的事件名舌仍，(不含“on”)
<font style="color: #000088;">fn：</font>移除事件的函數(shù)

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

<font style="color:#8d0000;">取消冒泡兼容各個瀏覽器的寫法</font>

<font style = "color: #8d0080;">參數(shù)：</font>

<font style="color: #000088;">ev: </font>要取消冒泡的事件對象

    function stopBubble(ev){
        if(ev && ev.stopPropagation){
            ev.stopPropagation();
        }else{
            ev.cancelBubble=true;
        }
    }

<font style="color:#8d0000;">獲取計算后樣式兼容的寫法</font>

<font style = "color: #8d0080;">參數(shù)：</font>

<font style="color: #000088;">element: </font>要獲取樣式的元素
<font style="color: #000088;">key: </font>要獲取的樣式

    function getStyle(element,key,wei){
        if(element.currentStyle){
            return element.currentStyle[key];
        }else{
            if(wei==undefined){
                wei=null;
            }
            return getComputedStyle(element,wei)[key];
        }
    }

<font style="color:#8d0000;">滾輪事件兼容各個瀏覽器的寫法</font>

<font style = "color: #8d0080;">參數(shù)：</font>

<font style="color: #000088;">ele: </font>要綁定滾輪事件的元素
<font style="color: #000088;">fn: </font>滾輪事件要執(zhí)行的函數(shù)

    function addMousewheel(ele,fn){
        if(navigator.userAgent.indexOf("Firefox")!=-1){
            // 火狐
            ele.addEventListener("DOMMouseScroll",fn,false);
        }else{
            // 谷歌啄踊、IE
            ele.onmousewheel=fn;
        }
    }