在學習離線檢測的使用，書上說HTML5定了倆個事件：online和offline。
當網路從離線變成線上或者從線上變成離線時，分別觸發這倆個事件。
程式碼如下：

    EventUtil.addHandler(window,"online",function () {
        alert("離線轉化成線上！");
    });
    EventUtil.addHandler(window,"offline",function () {
        alert("線上轉化成離線！");
    })

但是執行時，瀏覽器會報錯，EventUtil is no defined

查閱資料才發現，原來EventUtil是需要自己封裝的！！！！
程式碼如下：

  var EventUtil={

        addHandler:function(element,type,handler){ //新增事件
            if(element.addEventListener){
                element.addEventListener(type,handler,false);  //使用DOM2級方法新增事件
            }else if(element.attachEvent){                    //使用IE方法新增事件
                element.attachEvent("on"+type,handler);
            }else{
                element["on"+type]=handler;          //使用DOM0級方法新增事件
            }
        },

        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){  //使用這個方法跨瀏覽器取得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){  //立即停止事件在DOM中的傳播
            //避免觸發註冊在document.body上面的事件處理程式
            if(event.stopPropagation){
                event.stopPropagation();
            }else{
                event.cancelBubble=true;
            }
        },

        getRelatedTarget:function(event){  //獲取mouseover和mouseout相關元素
            if(event.relatedTarget){
                return event.relatedTarget;
            }else if(event.toElement){      //相容IE8-
                return event.toElement;
            }else if(event.formElement){
                return event.formElement;
            }else{
                return null;
            }
        },

        getButton:function(event){    //獲取mousedown或mouseup按下或釋放的按鈕是滑鼠中的哪一個
            if(document.implementation.hasFeature("MouseEvents","2.0")){
                return event.button;
            }else{
                switch(event.button){   //將IE模型下的button屬性對映為DOM模型下的button屬性
                    case 0:
                    case 1:
                    case 3:
                    case 5:
                    case 7:
                        return 0;  //按下的是滑鼠主按鈕（一般是左鍵）
                    case 2:
                    case 6:
                        return 2;  //按下的是中間的滑鼠按鈕
                    case 4:
                        return 1;  //滑鼠次按鈕（一般是右鍵）
                }
            }
        },

        getWheelDelta:function(event){ //獲取表示滑鼠滾輪滾動方向的數值
            if(event.wheelDelta){
                return event.wheelDelta;
            }else{
                return -event.detail*40;
            }
        },

        getCharCode:function(event){   //以跨瀏覽器取得相同的字元編碼，需在keypress事件中使用
            if(typeof event.charCode=="number"){
                return event.charCode;
            }else{
                return event.keyCode;
            }
        }

    };
 

定義了EventUtil後就可以使用了！！！

順便一提:navigator.onLine可以檢查裝置是否線上或者離線哦，true表示線上，false表示離線