How to autorefresh if page failed to load?

Question

I had come up with these solution:

My Solution / Expectation:
Put a setTimeout(). So if the page will still not load, in 5sec, I will reload(auto) the page.

See code:

var time;
window.onload = function(){
    time = setTimeout(function(){ document.location.reload(); }, 5000);
};

$(document).ready(function(){
    clearTimeout(time);
});

My Problem with this solution, is that the page will still reload even if the page has already loaded.

I want to cancel the setTimeout if the page has already loaded, but the code above does not working as expected.

Someone could help me, I really needing this to my thesis. Please help. Thanks in adv.

Possible duplicate of [Detect if page has finished loading](https://stackoverflow.com/questions/7083693/detect-if-page-has-finished-loading) — tbhaxor, Jan 19 '19 at 08:07
have you tried document.readyState === 'complete' condition? — p u, Jan 19 '19 at 08:08
Please note that on mobile it might take longer to load the page, so you will end up with a reload loop. — Art3mix, Jan 19 '19 at 08:21
@Joshua first I am mam :P and second i have posted my answer mark it correct as it helped you :) — p u, Jan 19 '19 at 08:30

score 2 · Accepted Answer · answered Jan 19 '19 at 08:29

This will help..as the document itself have readyState variable

var time;
window.onload = function() {
    time = setTimeout(function() {
        if (document.readyState === 'complete') {
            clearTimeout(time);
        } else {
            document.location.reload();
        }

    }, 5000);
};

score 1 · Answer 2 · answered Jan 19 '19 at 08:48

Instead of the jQuery, use document.readyState like so:

var time;
window.onload = function(){
    time = setTimeout(function(){
        document.location.reload(); 
    }, 5000);
};

document.onreadystatechange = function() {
    if (document.readyState == "complete") {
        clearTimeout(time);
    }
}

How to autorefresh if page failed to load?

2 Answers2