Can Javascript Detect When The User Stops Loading The Document?

I'm implementing Comet using the script tag long polling technique, based on this page. One issue (that I don't think there's a solution for) is the 'throbber of doom' - the browse

Solution 1:

As I suggested in the comments... add the script in the onload event.

Edit: I guess I can explain my reasoning for the suggestion, hopefully it'll help others trying to save the same problem.

A browser will continue to "load" (and thus play the throbber) until it has fired the onload event for every "window" (each DOM tree with a global window parent) in a given window or tab. Many outside resources are able to download in parallel, but by default—and in fact, there is no escaping this default in any browser except IE (using the defer attribute on the <script> tag)—<script> resources will "block" further processing of the document. If the <script> resource request never completes, the page's onload event never fires (and there are other side effects as well, if there is content after the <script> in the DOM: the DOM may never be fully loaded, and resources after that <script> may never load at all), and thus never finishes "loading".

Carrying on from that, you may also be able to improve performance by adding an initial <script> at when the DOM is loaded, with a defer attribute for IE, and cutting the connection for other browsers when you expect the onload event would fire (this is hard to pinpoint exactly and may require experimentation).

To keep this answer up to date... the defer attribute is available in most modern browsers now.

Solution 2:

I asked the very samea very similar question a few days ago and the general notion was no.

Solution 3:

Looks like the DOMContentLoaded event does the trick in Firefox 3.5 - it's fired the first time the user stops loading the page. After that the Stop button is disabled. The user can still press Escape to stop loading again, but I can detect that using onkeydown.

However, this doesn't work in Chrome - it fires DOMContentLoaded as soon as the page loads, without waiting for my dynamically generated <script> tags.

Solution 4:

Yes, you can!

These is no direct dom api to help you trigger the event when use stops loading the page. However, you can detect it under the help of two events:

1.The load event of window.

2.The readystatechange event of document.

chrome will triggle load and readystatechange event both when the page was loaded as normally. when user stops loading, chrome will triggle readystatechange event, however, load event will be ignored.

Here is a example code:

var isLoaded = false;
        window.addEventListener("load", function () {
            isLoaded = true;
        });
        document.addEventListener("readystatechange", function () {
            if (document.readyState == "complete") {
                setTimeout(function() {
                    if (!isLoaded) {
                        console.log("abort");//HERE
                    }
                },100);
            }
        });