2017-03-09 1 views
0

Ich versuche, Inhalt mit einem AJAX-Aufruf zu laden, und NACH dem Laden des Inhalts führen Sie eine andere Aktion durch. In meinem Beispiel ist diese letztere Aktion einfach eine Warnung, aber in meinem realen Beispiel versuche ich mich auf ein Eingabefeld zu konzentrieren.jQuery .load() Callback

$("#box").load("/favicon.png", function(response) { 
    alert('do after the load'); 
}); 

https://jsfiddle.net/u0cmmn5h/

Wie Sie in der Geige sehen können, ist der Alarm ausgelöst wird, bevor das Favicon tatsächlich geladen. Soll die Funktion nicht ausgelöst werden, nachdem der Inhalt geladen wurde?

+0

"Warnmeldungen" und ähnliche OS-Popups sind schlechtes Design, da sie aufdringlich und blockierend sind, die Ausführung des Seitencodes wird nur fortgesetzt, wenn eine bestimmte Benutzeraktion ausgeführt wird. Verwenden Sie nach Möglichkeit eine benutzerdefinierte Lösung. In Ihrem Fall sollten Sie besser mit 'console.log ('tun nach dem Laden');' zu Testzwecken gehen. –

+0

Sie könnten die Funktion in [Versprechen] (https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Objets_globaux/Promise) oder [jQuerys äquivalentes verzögertes Objekt] (https: //api.jquery) einbinden .com/jQuery.Deferred /), so dass es mit '.then (function() {})' und anderen verknüpft werden kann. Versprechen werden aufgelöst, wenn der JavaScript-Code aufgelöst wird. Dies ist möglicherweise nicht der genaue Zeitpunkt, zu dem das Bild auf dem Bildschirm angezeigt wird. –

Antwort

2

Der Rückruf bei .load() führt auf eine HTTP-Antwort, nicht, wenn das Bild Clientseite wiedergegeben wird.

+0

Verstanden. Ich denke, ich sollte stattdessen $ .ajax() verwenden. Muss ich Versprechen noch implementieren, wenn ich es auf $ .ajax() umschalte und das Ereignis (alert in diesem Fall) als Erfolg für die ajax() Anfrage einstelle? –

+0

Die Geige wurde aktualisiert, um meine Frage zu illustrieren: https://jsfiddle.net/u0cmn5h/2/ –

0

Hier ist ein Beispiel für die Verwendung von load auf einem Bild. Nicht sicher, was Sie haben die load auf einem div.

Die load Methode gebrannt werden, wenn die Bild src Attributänderungen und das Bild erfolgreich geladen werden (beachten Sie, wenn es dies gewohnt ausführen fehlschlägt).

.load() jQuery

Das Lastereignis wird an ein Element gesendet wird, wenn es und alle Subelemente vollständig geladen werden. Dieses Ereignis kann an jedes Element gesendet werden, das einer URL zugeordnet ist: Bilder, Skripts, Frames, Iframes und das Fensterobjekt.

$(function() { 
 
\t $('img').load(function() { 
 
    \t alert('done after load'); 
 
    }).attr('src', '/favicon.ico'); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 
<div id="box"> 
 
    <img /> 
 
</div>