Hinzufügen zu window.onload Ereignis?

Question

Ich frage mich, wie ein weiterer Methodenaufruf zum window.onload -Ereignis hinzugefügt werden, sobald es bereits einen Methodenaufruf zugeordnet wurde.

Es sei irgendwo im Skript, das ich diese Aufgabe haben ...

window.onload = function(){ some_methods_1() }; 

und dann später im Skript I

diese Zuordnung haben

window.onload = function(){ some_methods_2() }; 

Wie es aussieht, nur some_methods_2 wird aufgerufen, . Gibt es eine Möglichkeit, zum vorherigen window.onload Rückruf hinzuzufügen, ohne some_methods_1 zu stornieren? (und auch ohne some_methods_1() und some_methods_2() in den gleichen Funktionsblock).

Ich denke, diese Frage ist nicht wirklich über window.onload, sondern eine Frage über Javascript im Allgemeinen. Ich möchte nichts window.onload so zuweisen, dass, wenn ein anderer Entwickler an dem Skript arbeiten und ein Stück Code hinzufügen würde, der auch window.onload verwendet (ohne meinen vorherigen Code anzuschauen), würde er mein Onload-Ereignis deaktivieren .

Ich frage mich auch das gleiche über

$(document).ready() 

in jquery. Wie kann ich hinzufügen, ohne zu zerstören, was vorher kam, oder was könnte danach kommen?

Answer 1

Wenn Sie jQuery verwenden, müssen Sie nichts Besonderes tun. Handlers hinzugefügt über $(document).ready() nicht überschreiben sich gegenseitig, sondern wiederum ausführen:

$(document).ready(func1) 
... 
$(document).ready(func2) 

---

Wenn Sie nicht jQuery verwenden, können Sie addEventListener nutzen könnten, wie Karaxuna demonstriert plus attachEvent für IE < 9 .

Beachten Sie, dass ist nicht gleichbedeutend mit $(document).ready() - der ehemalige wartet auf CSS, Bilder ... als auch, während letztere nur auf den DOM-Baum wartet. Moderne Browser (und IE seit IE9) unterstützen das Ereignis DOMContentLoaded auf dem Dokument, das dem Ereignis jQuery ready entspricht, aber IE < 9 nicht.

if(window.addEventListener){ 
    window.addEventListener('load', func1) 
}else{ 
    window.attachEvent('onload', func1) 
} 
... 
if(window.addEventListener){ 
    window.addEventListener('load', func2) 
}else{ 
    window.attachEvent('onload', func2) 
} 

---

Wenn keine Option verfügbar ist (zum Beispiel, Sie sind nicht mit DOM-Knoten zu tun), können Sie dies tun (ich benutze onload als Beispiel, aber auch andere Optionen sind für onload):

var oldOnload1=window.onload; 
window.onload=function(){ 
    oldOnload1 && oldOnload1(); 
    func1(); 
} 
... 
var oldOnload2=window.onload; 
window.onload=function(){ 
    oldOnload2 && oldOnload2(); 
    func2(); 
} 

oder zu vermeiden, den globalen Namensraum verschmutzen (und wahrscheinlich Namespace Kollisionen) zu begegnen, mit dem Import/Export-IIFE Muster:

window.onload=(function(oldLoad){ 
    return function(){ 
    oldLoad && oldLoad(); 
    func1(); 
    } 
})(window.onload) 
... 
window.onload=(function(oldLoad){ 
    return function(){ 
    oldLoad && oldLoad(); 
    func2(); 
    } 
})(window.onload) 

Answer 2

können Sie verwenden attachEvent (IE8) und addEventListener statt

addEvent(window, 'load', function(){ some_methods_1() }); 
addEvent(window, 'load', function(){ some_methods_2() }); 

function addEvent(element, eventName, fn) { 
    if (element.addEventListener) 
     element.addEventListener(eventName, fn, false); 
    else if (element.attachEvent) 
     element.attachEvent('on' + eventName, fn); 
} 

Answer 3

Es gibt grundsätzlich zwei Möglichkeiten,

1. speichern den vorherigen Wert von window.onload so Ihr Code eine frühere Handler vorhanden nennen kann, wenn vor oder nachdem Ihr Code ausgeführt

2. mit der addEventListener Ansatz (das natürlich nicht von Microsoft und erfordert, dass Sie einen anderen Namen verwenden).

Die zweite Methode wird Sie ein bisschen mehr Sicherheit geben, wenn ein anderes Skript window.onload nutzen will und tut es ohne die Zusammenarbeit zu denken, aber die Hauptvoraussetzung für Javascript ist, dass alle Skripte zusammenarbeiten werden, wie Sie zu tun versuchen, .

Beachten Sie, dass ein schlechtes Skript, das nicht für die Arbeit mit anderen unbekannten Skripten entwickelt wurde, immer in der Lage ist, eine Seite zu durchbrechen, indem es beispielsweise mit Prototypen verschmutzt, den globalen Namespace verunreinigt oder die Domäne beschädigt.

Answer 4

Dies könnte nicht eine beliebte Option sein, aber manchmal sind die Skripte am Ende in verschiedene Stücke verteilt sind, in diesem Fall habe ich das eine schnelle Lösung

if(window.onload != null){var f1 = window.onload;} 
window.onload=function(){ 
    //do something 

    if(f1!=null){f1();} 
} 

dann woanders zu sein gefunden.

..

if(window.onload != null){var f2 = window.onload;} 
window.onload=function(){ 
    //do something else 

    if(f2!=null){f2();} 
} 

diese aktualisiert die onload Funktion und Kette nach Bedarf