पता लगाएँ कि क्या पेज लोड हो रहा है

Question 1

क्या पता लगाने का कोई तरीका है कि किसी पृष्ठ ने अपनी सभी सामग्री, जावास्क्रिप्ट और परिसंपत्तियाँ जैसे सीएसएस और छवियों को लोड करना समाप्त किया है?

बिल्कुल वैसा ही:

if(PAGE HAS FINISHED LOADING)
{
// do something amazing
}

और इसके अतिरिक्त यदि पृष्ठ 1 मिनट से अधिक समय से लोड हो रहा है तो कुछ और करें जैसे:

if(PAGE HAS BEEN LOADING FOR 1 MIN)
{
// do something else amazing
}

मैंने देखा है कि Apple के MobileMe जैसी वेबसाइटें समान जांच करती हैं, लेकिन अपने विशाल कोड पुस्तकालयों में इसका पता नहीं लगा पाई हैं।

क्या कोई मदद कर सकता है?

धन्यवाद

संपादित करें: यह अनिवार्य रूप से वह है जो मैं करना चाहता हूं:

// hide content
$("#hide").hide();

// hide loading
$("#loading").hide();

// fade in loading animation
setTimeout($('#loading').fadeIn(), 200);

jQuery(window).load(function() {
  $("#hide").fadeIn();

  $("#loading").fadeOut(function() {
    $(this).remove();
    clearInterval(loadingAnim);
  });

  setTimeout(function() {
    $("#error").fadeIn();
  }, 60000);
});

Question 2

jQuery(window).load(function () {
    alert('page is loaded');

    setTimeout(function () {
        alert('page is loaded and 1 minute has passed');   
    }, 60000);

});

या http://jsfiddle.net/tangibleJ/fLLrs/1/

JQuery (विंडो) .लोड पर स्पष्टीकरण के लिए http://api.jquery.com/load-event/ भी देखें ।

अपडेट करें

जावास्क्रिप्ट लोड हो रहा है और दो घटनाओं DOMContentLoaded और OnLoad कैसे काम करता है पर एक विस्तृत विवरण इस पृष्ठ पर पाया जा सकता है ।

DOMContentLoaded : जब DOM हेरफेर करने के लिए तैयार है। jQuery के इस ईवेंट को कैप्चर करने का तरीका है jQuery(document).ready(function () {});।

ओनोलाड : जब DOM तैयार होता है और सभी संपत्तियाँ - इसमें चित्र, iframe, फोंट, आदि शामिल होते हैं - लोड किए गए होते हैं और चरखा / घंटा क्लास गायब हो जाता है। इस घटना को कैप्चर करने का jQuery का तरीका उपर्युक्त है jQuery(window).load।

Question 3

वहाँ क्या आप के लिए देख रहे हैं के आधार पर jquery में ऐसा करने के दो तरीके हैं ..

jquery का उपयोग करके आप कर सकते हैं

// यह कॉल करने से पहले लोड की जाने वाली टेक्स्ट एसेट्स का इंतजार करेगा (डोम .. css .. js)
```
$(document).ready(function(){...});
```
// यह निष्पादित करने से पहले सभी छवियों और पाठ परिसंपत्तियों को लोडिंग समाप्त करने के लिए इंतजार करेगा
```
$(window).load(function(){...});
```

Question 4

उसे ओनलोड कहा जाता है। DOM तैयार वास्तव में उस सटीक कारण के लिए बनाया गया था जो onload छवियों पर इंतजार कर रहा था। ( कुछ समय पहले सिम्मिलर प्रश्न पर माचू से लिया गया उत्तर ।)

window.onload = function () { alert("It's loaded!") }

onload सभी संसाधनों की प्रतीक्षा करता है जो दस्तावेज़ का हिस्सा हैं।

एक सवाल का लिंक जहां उन्होंने यह सब समझाया:

मुझे क्लिक करें, आप जानते हैं कि आप चाहते हैं!

Question 5

मुझे लगता है कि सबसे आसान तरीका होगा

var items = $('img, style, ...'), itemslen = items.length;

items.bind('load', function(){ 
    itemslen--;
    if (!itemlen) // Do stuff here
});

EDIT, थोड़ा पागल होना:

var items = $('a, abbr, acronym, address, applet, area, audio, b, base, ' + 
    'basefont, bdo, bgsound, big, body, blockquote, br, button, canvas, ' + 
    'caption, center, cite, code, col, colgroup, comment, custom, dd, del, ' +
    'dfn, dir, div, dl, document, dt, em, embed, fieldset, font, form, frame, ' +
    'frameset, head, hn, hr, html, i, iframe, img, input, ins, isindex, kbd, ' +
    'label, legend, li, link, listing, map, marquee, media, menu, meta, ' +
    'nextid, nobr, noframes, noscript, object, ol, optgroup, option, p, ' +
    'param, plaintext, pre, q, rt, ruby, s, samp, script, select, small, ' + 
    'source, span, strike, strong, style, sub, sup, table, tbody, td, ' + 
    'textarea, tfoot, th, thead, title, tr, tt, u, ul, var, wbr, video, ' + 
    'window, xmp'), itemslen = items.length;

items.bind('load', function(){ 
    itemslen--;
    if (!itemlen) // Do stuff here
});

Question 6

एक अन्य विकल्प आप दस्तावेज़ की जांच कर सकते हैं। पहले से ही जैसे,

var chkReadyState = setInterval(function() {
    if (document.readyState == "complete") {
        // clear the interval
        clearInterval(chkReadyState);
        // finally your page is loaded.
    }
}, 100);

रेडीस्टेट पेज के प्रलेखन से पूर्ण राज्य का सारांश है

"लोड हो रहा है" लौटाता है, जबकि दस्तावेज़ लोड हो रहा है, "इंटरएक्टिव" एक बार यह पार्सिंग समाप्त हो गया है लेकिन अभी भी लोड हो रहा है उप-संसाधन, और "पूरा" एक बार लोड होने के बाद।

Question 7

एक विकल्प यह है कि पृष्ठ रिक्त हो, जिसमें थोड़ी मात्रा में जावास्क्रिप्ट हो। वास्तविक पृष्ठ सामग्री प्राप्त करने के लिए AJAX कॉल करने के लिए स्क्रिप्ट का उपयोग करें और वर्तमान दस्तावेज़ पर परिणाम लिखने के लिए सफलता समारोह लिखें। टाइमआउट फ़ंक्शन में आप "कुछ और अद्भुत कर सकते हैं"

अनुमानित छद्मकोश:

$(document).ready(function(){
    $.ajax
      url of actual page
      success:do something amazing
      timeout: do something else
});

Question 8

क्या यह है जो आप के मन में था?

$("document").ready( function() {
    // do your stuff
}

Question 9

var pageLoaded=0;

$(document).ready(function(){
   pageLoaded=1;
});

Jquery का उपयोग करना: https://learn.jquery.com/using-jquery-core/document-ready/

Question 10

Jquery या उस बीक्युस की तरह कुछ भी क्यों नहीं?

var loaded=0;
var loaded1min=0;
document.addEventListener("DOMContentLoaded", function(event) {
   loaded=1;
    setTimeout(function () {
      loaded1min=1;
    }, 60000);
});

Question 11

लोगों की FYI करें जिन्होंने टिप्पणियों में पूछा है, यह वही है जो मैं वास्तव में परियोजनाओं में उपयोग करता हूं:

function onLoad(loading, loaded) {
    if(document.readyState === 'complete'){
        return loaded();
    }
    loading();
    if (window.addEventListener) {
        window.addEventListener('load', loaded, false);
    }
    else if (window.attachEvent) {
        window.attachEvent('onload', loaded);
    }
};

onLoad(function(){
   console.log('I am waiting for the page to be loaded');
},
function(){
    console.log('The page is loaded');
});