Javascript: Détecter lorsqu'une fenêtre est complètement chargée

Question

J'ai un script qui peut être chargé à n'importe quelle étape du cycle de vie d'une page Web. Lorsque le script est chargé, il doit exécuter une méthode initialize(). Je souhaite que cette fonction soit exécutée sur l'événement "onload", mais je ne peux pas être certain que la page n'a pas déjà été chargée, c'est-à-dire que le "onload" n'a pas déjà été déclenché.

Idéalement mon script ressemblerait à ceci:

var _initialize = function() { ...}; 

if(window.LOADED) 
    _initialize(); 
else if (window.addEventListener) 
    window.addEventListener('load', _initialize, false); 
else if (window.attachEvent) 
    window.attachEvent('onload', _initialize); 

Y at-il un tel window.LOADED ou document.LOADED variable ou quelque chose de similaire?

Merci à l'avance, Shane

Answer 1

Vous pouvez utiliser jQuery pour le faire. $(document).ready(). Vérifiez this

Appelez simplement la fonction que vous voulez à l'intérieur du prêt. Ensuite, il sera exécuté une fois que le document est entièrement chargé

Answer 2

vous pouvez utiliser

jQuery(document).ready(); 

à la fin de la page ou juste avant l'étiquette et il appellera alors que votre page Web présente sur la machine client et environ au moment du chargement .....

Answer 3

de fin Si vous n'utilisez pas la bibliothèque, vous pouvez utiliser cette

function somelib(){ 
     this.readystate = false; //tracks the state of DOM 
     var nextcallfunc;  //stores the function to be called after DOM is loaded 

    //called by checkReady function when DOM is loaded completely 
     this.ready = function(func){ 
      // quit if this function has already been called 
      if (arguments.callee.done) return; 
      // flag this function so we don't do the same thing twice 
      arguments.callee.done = true; 
      this.readystate=true;  //make DOM load permanent 
      nextcallfunc.call();  //calls the onload handler 
    } 

    //Checks if the DOM has loaded or not 
    this.checkReady= function(func){ 
     /* for Mozilla/Opera9 */ 
     nextcallfunc = func; 

     if (document.addEventListener) { 
      document.addEventListener("DOMContentLoaded", this.ready , false); 
     } 
     /* for Internet Explorer */ 
     /*@cc_on @*/ 
     /*@if (@_win32) 
      document.write("<script id=__ie_onload defer src=javascript:void(0)><\/script>"); 
      var script = document.getElementById("__ie_onload"); 
      script.onreadystatechange = function() { 
      if (this.readyState == "complete") { 
       ready(func); // call the onload handler 
      } 
      }; 
     /*@end @*/ 

     /* for Safari */ 
     if (/WebKit/i.test(navigator.userAgent)) { // sniff 
      var _timer = setInterval(function() { 
      if (/loaded|complete/.test(document.readyState)) { 
       this.ready(); // call the onload handler 
      } 
      }, 10); 
     } 

     /* for other browsers */ 
     window.onload = this.ready; 
    } 

    } 

cela résout aussi les problèmes croisés du navigateur ..

Answer 4

Voici ce que je (écrit en CoffeeScript):

$(window).on 'load', -> 
    window._loaded = true 

window.on_window_load_safe = (callback) -> 
    if window._loaded 
    # Since the load even already happened, if we tried to add a new callback now, it would not even 
    # get called. So just call the callback immediately now. 
    callback.call() 
    else 
    $(window).on 'load', -> 
     callback.call() 

Vous pouvez le tester avec quelque chose comme ceci:

setTimeout(-> 
    on_window_load_safe -> 
     console.debug 'on_window_load_safe called me' 
    , 2000)