670 Stimmen

Offizieller Weg, jQuery zu bitten, auf das Laden aller Bilder zu warten, bevor etwas ausgeführt wird

In jQuery, wenn Sie dies tun:

$(function() {
   alert("DOM is loaded, but images not necessarily all loaded");
});

Er wartet darauf, dass das DOM geladen wird, und führt Ihren Code aus. Wenn nicht alle Bilder geladen sind, wird der Code trotzdem ausgeführt. Das ist natürlich das, was wir wollen, wenn wir DOM-Sachen wie das Ein- oder Ausblenden von Elementen oder das Anhängen von Ereignissen initialisieren.

Nehmen wir aber an, ich möchte eine Animation, die erst dann läuft, wenn alle Bilder geladen sind. Gibt es eine offizielle Möglichkeit in jQuery, dies zu tun?

Der beste Weg, den ich kenne, ist die Verwendung von <body onload="finished()"> aber ich möchte das eigentlich nicht tun, es sei denn, ich muss es tun.

Anmerkung: Es gibt eine Fehler in jQuery 1.3.1 im Internet Explorer, der tatsächlich wartet, bis alle Bilder geladen sind, bevor er den Code ausführt $function() { } . Wenn Sie also diese Plattform verwenden, erhalten Sie das von mir gewünschte Verhalten anstelle des oben beschriebenen korrekten Verhaltens.

0voto

Carlos Román Punkte 57

Ich habe diese Lösung gefunden, indem ich: @Luca Matteis hier: https://www.examplefiles.net/cs/508021

Aber ich habe es ein wenig bearbeitet, wie gezeigt:

function showImage(el){
    $(el).removeClass('hidden');
    $(el).addClass('show');

    $(el).prev().removeClass('show');
    $(el).prev().addClass('hidden');
}

<img src="temp_image.png" />
<img class="hidden" src="blah.png" onload="showImage(this);"/>

CodeJaeger.com

CodeJaeger ist eine Gemeinschaft für Programmierer, die täglich Hilfe erhalten..
Wir haben viele Inhalte, und Sie können auch Ihre eigenen Fragen stellen oder die Fragen anderer Leute lösen.

Powered by:

X