Trucades Múltiples Funcions de Windows onload en JavaScript

7 març 2009 per Nikhil

Heres un altre petit tros de Javascript engany que havia de cavar al voltant perquè la situació commaned ella. En un dels meus llocs web, vaig tenir aquesta situació en què vaig haver de posar en pràctica "windows.onload" dues vegades. La primera cosa que va venir a la ment sense experiència com la meva (que he de dir honestament que, ja que he estat utilitzant frameworks de JavaScript i les biblioteques, he forgotton per fer coses simples pel meu compte ... trist però cert), és el següent mètode ...

 window.onload = onloadfn1;
 window.onload = onloadfn2;
 window.onload = onloadfn3;
 etc ...

Sento dir-ho, però, això no funcionarà ... No vull parlar de la ciència execució de Javascript molt ... però d'acord a la meva experiència recent, només l'última funció (onloadfn3) es malalta realment s'executen.

En situacions normals, a diferència de la meva (que vaig a parlar una mica més tard) ... que podria fer una de les següents accions per executar mutliple funcions onload ....

O alguna cosa com això

 doOnLoad function () {
         onloadfn1 ();
         onloadfn2 ();
         onloadfn3 ();
 }
 window.onload = doOnLoad;

Per la meva situació actual, no puc utilitzar qualsevol dels anteriors ...
Per què he de trucar windows.onload dues vegades, en lloc que cridar dues funcions dins d'una única funció onload? Aquí és ràpid cop d'ull al meu declaració problema ...

"Els meus pàgines del lloc estan estructurats com el tema de WordPress .... és a dir, hi ha una header.php i footer.php comú que aconsegueix inclòs en totes les pàgines del lloc. Hi ha una funció implementaion onload al footer.php fer algunes funcions onload comunes. I hi ha poques pàgines que necessiten una mica de la seva pròpia onload, a més dels realitzats per la funció onload comuna. Si assigno la funció de devolució de trucada directament al controlador window.onload, es sobre-passeig devolucions de trucada assignats prèviament al footer.php "

.... S'entén el meu problema :) ?

Bé! hi ha poques solucions que he trobat. Tots ells són molt similars i principalment implementions d'una solució donada per Simon Willison ( http://simonwillison.net/2004/May/26/addLoadEvent/ ) ...

Solució:

Només has d'afegir el codi javascript per lloc ...

 addLoadEvent funció (func) {
     var oldonload = window.onload;
     si (typeof window.onload! = 'funció') {
        window.onload = func
     } Else {
        window.onload = function () {
            si (oldonload) {
                   oldonload ()
           }
           func ()
        }
    }
 } 

I en diuen en lloc de la "windows.onload" habitual

 addLoadEvent (FunctionToRunOnPageLoad);
 addLoadEvent (function () {
 / * Més codi s'executi a la pàgina de càrrega *
 }); 

Els avantatges d'aquest fragment de codi ...
1. En primer lloc, se li permet tenir múltiples esdeveniments windows.onload, cridats a partir de peces separades del seu codi, sense overridding la definició anterior
2. És molt discret. Es pot col·locar en un arxiu amb les seves altres seqüències d'ordres o en un arxiu separat.
3. Funciona fins i tot si window.onload ja s'ha establert.

Etiquetes:


get ExpressingIT News by Email Rep les ExpressingIT per Correu | Segueix-me a Twitter


6 Respostes a "Calling Múltiples Funcions de Windows onload en javascript"

  1. Orren Smith diu:

    zPDidP Bé Gràcies És molt bonic,


  2. kleung11 diu:

    Això és molt net i funciona bé sense necessitat d'editar altres pàgines. Gràcies!


  3. Ullet diu:

    Va treballar meravellosament. Gràcies per compartir la seva solució vostè.


  4. Slava diu:

    Solució fantàstica!


  5. Desenvolupador diu:

    Moltes gràcies, això m'ajudi a resoldre el meu problema, després d'algunes nits de son a terme i una dotzena de gots de cafè d'aquest post finalment clavat el meu problema, moltes gràcies!


  6. Elvis diu:

    window.addEventListener ("càrrega", la funció () {alert ()});


Deixa una Resposta

Subscriu-te a ExpressingIT RSS
get ExpressingIT News by Email Rep les ExpressingIT per correu electrònic
Segueix-me a Twitter