detect change on navigator.online
-
16-12-2020 - |
Question
How can I detect if the navigator changed your state to online/offline?
something like:
var oldState = navigator.onLine;
window.navigator.onlinechange = function(evnt,newState) {
alert('your changed from' + oldState + ' to' + newState + 'state');
}
Solution
Something like this (not every browser supports these events, currently only IE 8,9 and FF > 3 support these events):
var el = document.body;
if (el.addEventListener) {
el.addEventListener("online", function () {
alert("online");}, true);
el.addEventListener("offline", function () {
alert("offline");}, true);
}
else if (el.attachEvent) {
el.attachEvent("ononline", function () {
alert("online");});
el.attachEvent("onoffline", function () {
alert("offline");});
}
else {
el.ononline = function () {
alert("online");};
el.onoffline = function () {
alert("offline");};
}
The browser support varies, check this out: http://help.dottoro.com/ljnasgpu.php
OTHER TIPS
With the help of classes on body and this code you can find
window.ononline = function() {
alert('You are now online');
}
window.onoffline = function() {
alert('You are now offline');
}
If it needs to be more cross browser compatible you have to poll the navigator.onLine property.
var status = document.getElementById('status')
setInterval(function () {
status.innerHTML = navigator.onLine ? 'online' : 'offline';
}, 250);
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow