Ich möchte eine Funktion aufrufen, nachdem ein Dokument geladen wurde, aber das Dokument wurde möglicherweise noch nicht vollständig geladen. Wenn es geladen wurde, kann ich einfach die Funktion aufrufen. Wenn es NICHT geladen wurde, kann ich einen Ereignis-Listener anhängen. Ich kann keinen Ereignislistener hinzufügen, nachdem der Onload bereits ausgelöst wurde, da er nicht aufgerufen wird. Wie kann ich also überprüfen, ob das Dokument geladen wurde? Ich habe den folgenden Code ausprobiert, aber er funktioniert nicht ganz. Irgendwelche Ideen?
var body = document.getElementsByTagName('BODY')[0];
// CONDITION DOES NOT WORK
if (body && body.readyState == 'loaded') {
DoStuffFunction();
} else {
// CODE BELOW WORKS
if (window.addEventListener) {
window.addEventListener('load', DoStuffFunction, false);
} else {
window.attachEvent('onload', DoStuffFunction);
}
}
javascript
events
onload
addeventlistener
Marcos
quelle
quelle
Antworten:
Der gesamte von Galambalazs erwähnte Code ist nicht erforderlich. Der browserübergreifende Weg, dies in reinem JavaScript zu tun, besteht einfach darin, Folgendes zu testen
document.readyState
:So macht es auch jQuery.
Je nachdem, wo das JavaScript geladen ist, kann dies innerhalb eines Intervalls erfolgen:
In der Tat
document.readyState
kann drei Zustände haben:Wenn Sie also nur das DOM benötigen, um bereit zu sein, suchen Sie nach
document.readyState === "interactive"
. Wenn Sie die gesamte Seite einschließlich der Bilder benötigen, suchen Sie nachdocument.readyState === "complete"
.quelle
document.readyState == "complete"
, bedeutet dies, dass alles, einschließlich Bilder, geladen wurde.document.readyState
um sicherzustellen, dass die Funktion nach dem Parsen von DOM oder später gestartet wird, je nachdem, wann es aufgerufen wurde. Gibt es eine Veranstaltung für interaktivereadyState
?/loaded|complete/.test(document.readyState)
. Einige Browser sinddocument.readyState
auf "geladen" anstatt auf "vollständig" eingestellt. Außerdem stellt document.readyState NICHT sicher, dass Schriftarten geladen wurden. Ohne Plugin gibt es keine wirklich gute Möglichkeit, dies zu testen.document.onreadystatechange
? Dies scheint rationaler zu sein, wenn Browser dies unterstützen. stackoverflow.com/questions/807878/…document.readyState !== "loading"
, nach dem Status "DOM bereit" zu suchen. Dies verhindert, dass Probleme auftreten, wenn dasreadyState
aus irgendeinem Grund zu spät überprüft wird (nach dem Status "Interaktiv").Keine Notwendigkeit für eine Bibliothek. jQuery hat dieses Skript übrigens eine Weile verwendet.
http://dean.edwards.name/weblog/2006/06/again/
quelle
init
wird nicht ausgeführt, wenn dieser von Ihnen veröffentlichte Code enthalten ist, nachdem die Seite bereits geladen wurde. Dies ist der Punkt des OP: Er kann nicht steuern, wann sein Skript enthalten ist. (Beachten Sie, dass nur dersetInterval
Zweig funktioniert)Sie möchten wahrscheinlich so etwas wie jQuery verwenden, was die JS-Programmierung erleichtert.
Etwas wie:
Scheint zu tun, was Sie suchen.
quelle
ready()
aufgerufen wird , wird sie sofort ausgeführt.quelle
document.loaded
ist immer undefiniertbody.readyState === 'loaded'
Wenn Sie möchten, dass dieser Code beim Laden ausgeführt wird , nicht beim Domready (dh Sie müssen auch die Bilder laden), dann erledigt die Ready-Funktion dies leider nicht für Sie. Ich mache im Allgemeinen einfach so etwas:
In Dokument-Javascript aufnehmen (dh immer aufgerufen, bevor Onload ausgelöst wird):
Dann dein Code:
(Oder das Äquivalent in Ihrem bevorzugten Rahmen.) Ich verwende diesen Code, um Javascript und Bilder für zukünftige Seiten vorzuspeichern. Da das, was ich bekomme, für diese Seite überhaupt nicht verwendet wird, möchte ich nicht, dass es Vorrang vor dem schnellen Herunterladen von Bildern hat.
Es mag einen besseren Weg geben, aber ich muss ihn noch finden.
quelle
Mozila Firefox sagt, das
onreadystatechange
sei eine Alternative zuDOMContentLoaded
.Im
DOMContentLoaded
Mozila-Dokument heißt es:Ich denke,
load
Ereignis sollte für ein vollständiges Laden von Dokumenten + Ressourcen verwendet werden.quelle
Das obige mit JQuery ist der einfachste und am häufigsten verwendete Weg. Sie können jedoch reines Javascript verwenden, aber versuchen Sie, dieses Skript im Kopf so zu definieren, dass es am Anfang gelesen wird. Was Sie suchen, ist
window.onload
Veranstaltung.Unten ist ein einfaches Skript, das ich erstellt habe, um einen Zähler auszuführen. Der Zähler stoppt dann nach 10 Iterationen
quelle
Versuche dies:
quelle
Ich habe eine andere Lösung. Meine Anwendung muss gestartet werden, wenn ein neues Objekt von MyApp erstellt wird. Es sieht also so aus:
Es funktioniert in allen Browsern, die ich kenne.
quelle