Heim > Web-Frontend > js-Tutorial > JQuery Führen Sie Code nach dem Laden des Bildes aus

JQuery Führen Sie Code nach dem Laden des Bildes aus

William Shakespeare
Freigeben: 2025-03-08 00:35:10
Original
654 Leute haben es durchsucht

jQuery Run Code After Image Loads

JQuery Führen Sie Code nach dem Laden des Bildes aus

Einfacher JQuery -Code -Snippet zum Warten auf ein Bild, bevor ein Code ausgeführt wird. Der einzige Nachteil ist, dass Sie den Bildnamen (einschließlich Erweiterung) angeben müssen.
<span>$('#myImage').attr('src', 'image.jpg').load(function() {  
</span>	<span>//run code
</span>	<span>alert('Image Loaded');  
</span><span>});</span>
Nach dem Login kopieren

häufig gestellte Fragen (FAQs) zu JQuery Image Load

Was ist das JQuery .load () Ereignis und wie funktioniert es? Dieses Ereignis ist besonders nützlich, wenn Sie bestimmte Aktionen erst ausführen möchten, nachdem ein Bild vollständig geladen wurde. Zum Beispiel möchten Sie möglicherweise eine Ladeanimation anzeigen, bis ein Bild vollständig geladen ist, und dann die Animation ausblenden. Das Ereignis .load () macht dies möglich. Es ist wichtig zu beachten, dass das Ereignis von .load () nicht mit allen Elementen in allen Browsern übereinstimmt. Es funktioniert am besten mit Elementen mit einem SRC -Attribut wie Bildern. Hier ist ein einfaches Beispiel:

$ ('img'). Load (function () {

// dein Code hier

});

In diesem Beispiel wird der Code innerhalb des Funktions ausgeführt, sobald das Bild geladen wurde. Schießen. Ein häufiger Grund ist, dass das Bild, das Sie zielen, bereits geladen wurden, bevor Ihr Skript ausgeführt wird. Dies kann passieren, wenn sich Ihr Skript im Kopf Ihres HTML -Dokuments befindet und sich das Bild im Körper befindet. Um dies zu vermeiden, können Sie Ihr Skript am Ende des Körpers platzieren oder die Funktion $ (Dokument) verwenden. Es ist jedoch wichtig zu beachten, dass das Ereignis von .load () nicht mit allen Elementen in allen Browsern übereinstimmt. Es funktioniert am besten mit Elementen wie Bildern. Dieses Ereignis löst eine Funktion aus, wenn beim Laden eines Elements ein Fehler auftritt. Hier ist ein Beispiel:


$ ('IMG'). Fehler (function () {
// Ihr Code hier
});
In diesem Beispiel wird der Code in der Funktion ausgeführt, wenn ein Fehler das Bild lädt.

Ist es möglich, das Ereignis von .load () mit zwischengespeicherten Bildern zu verwenden? Beachten Sie jedoch, dass ein Bild, wenn es zwischengespeichert wird, geladen werden kann, bevor Ihr Skript ausgeführt wird. Um dies zu verarbeiten, können Sie überprüfen, ob das Bild mit der Eigenschaft .Complete abgeschlossen ist. Wenn es abgeschlossen ist, können Sie Ihre Funktion sofort ausführen. Andernfalls können Sie das Ereignis von .load () verwenden. Die Methode .Promise () gibt ein Versprechen zurück, das auflöst, wenn alle Aktionen eines bestimmten Typs, der an die Sammlung gebunden ist, in der Warteschlange oder nicht beendet sind. Mit dem Ereignis von .load () kann eine Funktion ausgeführt werden, wenn eine AJAX -Anforderung abgeschlossen ist. Dies kann nützlich sein, wenn Sie eine Aktion ausführen möchten, nachdem Daten von einem Server geladen wurden. Dadurch wird eine AJAX -Anforderung an den Server gesendet und die Daten in das ausgewählte Element geladen. Es wird empfohlen, stattdessen die .on () -Methode zu verwenden, um Ereignishandler anzuhängen.

Das obige ist der detaillierte Inhalt vonJQuery Führen Sie Code nach dem Laden des Bildes aus. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Artikel des Autors
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage