wait () oder sleep () Funktion in jquery?

Ich möchte eine Klasse hinzufügen, 2 Sekunden warten und eine weitere Klasse hinzufügen.

.addClass("load").wait(2sec).addClass("done");

Gibt es irgendeinen Weg?

setTimeout führt einen Code nach einer Verzögerung von einer bestimmten Zeitspanne aus (gemessen in Millisekunden). Ein wichtiger Hinweis: Aufgrund der Natur von Javascript wird der Rest des Codes nach dem Einrichten des Timers weiterhin ausgeführt:

$('#someid').addClass("load");

setTimeout(function(){
  $('#someid').addClass("done");
}, 2000);

// Any code here will execute immediately after the 'load' class is added to the element.

Das wäre .delay().

http://api.jquery.com/delay/

Wenn Sie AJAX-Sachen machen, sollten Sie wirklich nicht einfach automatisch "fertig" schreiben, sondern wirklich auf eine Antwort warten und sehen, ob sie tatsächlich fertig ist.

delay () erledigt den Job nicht. Das Problem mit delay () ist, dass es Teil des Animationssystems ist und nur für Animationswarteschlangen gilt.

Was ist, wenn Sie warten möchten, bevor Sie etwas außerhalb der Animation ausführen?

Benutze das:

window.setTimeout(function(){
                 // do whatever you want to do     
                  }, 600);

Was passiert?: In diesem Szenario wartet es 600 Millisekunden, bevor der in geschweiften Klammern angegebene Code ausgeführt wird.

Das hat mir sehr geholfen, als ich es herausgefunden habe und hoffe, dass es auch Ihnen hilft!

WICHTIGER HINWEIS: 'window.setTimeout' erfolgt asynchron. Denken Sie daran, wenn Sie Ihren Code schreiben!

Erkenne, dass dies eine alte Frage ist, aber ich habe ein Plugin geschrieben, um dieses Problem zu beheben, das jemand nützlich finden könnte.

https://github.com/madbook/jquery.wait

können Sie dies tun:

$('#myElement').addClass('load').wait(2000).addClass('done');

Es gibt eine Funktion, aber sie ist extra: http://docs.jquery.com/Cookbook/wait

Mit diesem kleinen Ausschnitt können Sie warten:

$.fn.wait = function(time, type) {
    time = time || 1000;
    type = type || "fx";
    return this.queue(type, function() {
        var self = this;
        setTimeout(function() {
            $(self).dequeue();
        }, time);
    });
};

Sie können die .delay()Funktion verwenden.
Das ist, wonach Sie suchen:

.addClass("load").delay(2000).addClass("done");

Das xml4jQuery-Plugin gibt die Sleep-Methode (ms, callback) an. Die verbleibende Kette würde nach der Schlafphase ausgeführt.

$(".toFill").html("Click here")
                .$on('click')
                .html('Loading...')
                .sleep(1000)
                .html( 'done')
                .toggleClass('clickable')
                .prepend('Still clickable <hr/>');

.toFill{border: dashed 2px palegreen; border-radius: 1em; display: inline-block;padding: 1em;}
        .clickable{ cursor: pointer; border-color: blue;}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
   <script type="text/javascript" src="https://cdn.xml4jquery.com/ajax/libs/xml4jquery/1.1.2/xml4jquery.js"></script>
        <div class="toFill clickable"></div>

Verwenden Sie beispielsweise die Funktion setTimeout. Besuchen Sie hier zum Beispiel