Question

以下是我的代码。

简单地说，我不知道如何将连接从ONLINE转换为OFFLINE，以及将触发更新css（https://github.com/hubspot/offline）的事件。

如果从OFFLINE变为ONLINE，则会在10秒内更新。但我不确定如何让它在另一个方向发挥作用？

似乎我调用了Offline.check（）;手动它会更新，但理想情况下我希望它自动执行此操作。欢迎任何想法。

Offline.options = {
    checkOnLoad: true,
    checks: {
        image: {
            url: 'http://example.com/image.gif'
        },
        active: 'image'
    },
    reconnect: {
        initialDelay: 10, // only check every 10 seconds
        delay: 10
    }
};

Answer 1

您可以使用Offline.on(event, handler, context)了解连接何时联机/离线。

如果连接离线

Offline.on('up', function gotOnline(){
  console.log("I am online");
})

Offline.on('down', function gotOffline(){
  console.log("I am offline");
})

Answer 2

如果您阅读文档here，则可以看到离线具有某些属性，例如Offline.check()，Offline.state。

您可以使用其中任何一个来显示您需要的CSS。

例如：

if(Offline.state=='down'){
    /*assuming that you have that div in your css set to hidden or something else*/
    $("#offlineDiv").show('100'); //Just an imaginary div
}

然后当连接离线时.. 使用

offline.on(down, handler)..

现在这个处理程序利用上面的CSS开关来激活那个div。

Answer 3

这是我使用三元运算符的代码

connectionStatus = navigator.onLine ? 'online' : 'offline';
console.log(connectionStatus);

<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>

Offline.js - 在线检查？

3 个答案: