Wie kann ich feststellen, wann Änderungen an jquery html () abgeschlossen sind?

9

Ich verwende jQuery, um den HTML-Code eines Tags zu ändern, und der neue HTML-Code kann eine sehr lange Zeichenfolge sein.

$("#divToChange").html(newHTML);

Ich möchte dann die Elemente auswählen, die im neuen HTML erstellt wurden, aber wenn ich den Code unmittelbar nach der obigen Zeile setze, scheint es eine Wettlaufbedingung mit einer langen Zeichenkette zu erzeugen, wo die Änderungen, die html () macht, nicht unbedingt sein müssen fertiges Rendering In diesem Fall funktioniert die Auswahl der neuen Elemente nicht immer.

Was ich wissen möchte ist, gibt es ein Ereignis gefeuert oder eine andere Art, benachrichtigt zu werden, wenn Änderungen an html () das Rendern beendet haben? Ich stieß auf das jQuery-Watch-Plugin, das als Workaround funktioniert, aber es ist nicht ideal. Gibt es einen besseren Weg?

    
mikel 03.04.2010, 02:45
quelle

2 Antworten

5

Wie bereits erwähnt, ist JavaScript single threaded, so dass Sie keine Race Conditions bekommen können.

Was Sie jedoch stolpern könnte, ist die Tatsache, dass die Benutzeroberfläche sich nicht auf Basis von JavaScript aktualisiert, bis ein Thread fertig ist. Das bedeutet, dass die gesamte Methode abgeschlossen werden muss, einschließlich des gesamten Codes, nachdem Sie html(...) aufgerufen haben, bevor der Browser den Inhalt rendert.

Wenn Ihr Code nach dem Aufruf von html(...) auf dem Layout der Seite basiert, die neu berechnet wird, bevor Sie fortfahren, können Sie Folgendes tun:

%Vor%

Die Verwendung von setTimeout(...) mit einer Zeit von 1 in JavaScript verzögert die Ausführung, bis der aktuelle JavaScript-Code in der aufrufenden Funktion beendet ist und der Browser die Benutzeroberfläche aktualisiert hat. Dies kann Ihr Problem lösen, obwohl es schwer zu sagen ist, es sei denn, Sie können ein reproduzierbares Beispiel für den Fehler liefern, den Sie bekommen.

    
Dan Herbert 03.04.2010, 02:55
quelle
0

Es ist 7 Jahre später und ich bin gerade in ein Szenario gelaufen, das genau dem @ mikel entspricht, auf dem ich eine "timerbasierte Lösung" nicht vermeiden konnte. Also teile ich nur die Lösung, die ich entwickelt habe, für den Fall, dass jemand da draußen noch Probleme hat.

Ich hasse setTimeout s und setInterval s in meinem Code. Also habe ich ein kleines Plugin erstellt, das Sie dort platzieren können, wo Sie es für das beste halten. Ich habe setInterval verwendet, aber Sie können es in setTimeout oder eine andere Lösung, an die Sie denken, ändern. Die Idee besteht einfach darin, ein Versprechen zu formulieren und nach dem Element zu suchen. Wir lösen das Versprechen, sobald es fertig ist.

%Vor%     
Matheus Dal'Pizzol 10.01.2018 16:20
quelle

Tags und Links