Offline browsing is becoming more and more popular in HMTL5 mobile applications. However, the advent of new technologies can sometimes lead to additional distress for our web developers, such as how to tell if a user is online or offline now? Fortunately, there are spears with shields, and navigator objects in JavaScript help us solve this problem. The
navigator.online
Navigator.online property provides us with a Boolean value to determine whether the user is connected to the Internet. You can access it this way:
if (navigator.online) {//True|false
//...
}
Nothing is simpler than this!
Events
We can also bind offline and online events in addition to this offline/on-line property value:
Function Updateindicator () {
//can then update online status according to the Offline/online button's color
}
///According to Network Connections
Window.addeventlistener (' Online ', updateindicator);
Window.addeventlistener (' Offline ', updateindicator);
Updateindicator ();
Of course, the old-fashioned technology also provides a way to use the Ononline and Onoffline methods on the body tag.
I can imagine that many places need to use these events and properties. such as a situation, when the user is working, break the net, if our Web application can detect this state, you can keep the user's writing to the local Web storage, and so on after the network recovery, and then submit to the server, so, broken network will not give users the writing impact. This is just a simple example, I believe you can come up with more. The
needs to be reminded that this API is not so reliable. The oldest technique for timing refreshes can be used as a record.
HTML5 judgment device online offline and monitor network status change Example
tested Android ipad default browser support, Appcan encapsulated Web page also supports
<!doctype html>