如何回撥在線/離線狀態？

Question

當我在jsfiddle上擺弄時，我失去了互聯網連接。然後，該網站提醒我我沒有互聯網連接。在這裏，通過點擊禁用您的連接給出一個嘗試：

a sample code

它們在某種程度上實現哪些檢查互聯網連接沒有任何Ajax請求不像this代碼。

我發現這個片段經過一番挖掘

Heyoffline.prototype.setup = function() { 
    this.events = { 
    element: ['keyup', 'change'], 
    network: ['online', 'offline'] // THIS PART 
    }; 
    this.elements = { 
    fields: document.querySelectorAll(this.options.elements.join(',')), 
    overlay: document.createElement('div'), 
    modal: document.createElement('div'), 
    heading: document.createElement('h2'), 
    content: document.createElement('p'), 
    button: document.createElement('a') 
    }; 

但我不明白它是如何工作的，因爲它是自動生成的。 LINK

任何人都可以擺脫一些光線，所以我可以在我的系統中實現這樣的東西。

Answer 1

神奇的是在這裏完成

Heyoffline.prototype.networkEvents = function(event) { 
    return addEvent(window, event, this[event]); 
}; 

這就是所謂的attachEvents

Heyoffline.prototype.attachEvents = function() { 
     var event, field, _i, _j, _len, _len1, _ref, _ref1, 
     _this = this; 
     _ref = this.elements.fields; 
     for (_i = 0, _len = _ref.length; _i < _len; _i++) { 
      field = _ref[_i]; 
      this.elementEvents(field); 
     } 
     _ref1 = this.events.network; 
     for (_j = 0, _len1 = _ref1.length; _j < _len1; _j++) { 
      event = _ref1[_j]; 
      this.networkEvents(event); //Called here 
     } 
     return addEvent(window, 'resize', function() { 
      return _this.resizeOverlay(); 
     }); 
    }; 

的情況下，無論在線或離線傳遞到這一點，addEvent函數定義

addEvent作爲：

addEvent = function(element, event, fn, useCapture) { 
    if (useCapture == null) { 
     useCapture = false; 
    } 
    return element.addEventListener(event, fn, useCapture); 
}; 

那麼真的有什麼我可以看到使用在線/離線功能，所有你需要做的準備就是調用：

//online 
window.addEventListener('online', function(){alert('You are online')}, false); 
//offline 
window.addEventListener('offline', function(){alert('You are online')}, false); 

和鮑勃雅叔叔

這裏測試，以及：http://jsfiddle.net/W4EKh/

jsfiddle之後警告出現，所以我很確定它是如何工作的...

還有，繼承人的東西來幫忙:)）...

function networkListener(a, b){ 
    var offlineF, onlineF; 
    if(a instanceof Function && b instanceof Function){ 
     onlineF = a; 
     offlineF = b; 
    }else if(a instanceof Function){ 
     if(typeof b === "string"){ 
      if(b === "online"){ 
       onlineF = a; 
      }else if(b === "offline"){ 
       offlineF = a; 
      } 
     }else{ 
      onlineF = a; 
     } 
    } 
    if(typeof onlineF !== "undefined"){ 
     window.addEventListener('online', onlineF, false); 
    } 
    if(typeof offlineF !== "undefined"){ 
     window.addEventListener('offline', offlineF, false); 
    } 
} 

在這裏，你可以嘗試一下......

http://jsfiddle.net/47N6L/2/