Question

我想添加一个类，等待2秒并添加另一个类。

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

有什么办法吗？

Answer 1

setTimeout将在一段时间的延迟（以毫秒为单位）后执行一些代码。但是，一个重要的注意事项：由于javascript的性质，其余代码在设置计时器后继续运行：

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

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

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

Answer 2

那是.delay()。

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

如果你正在做AJAX的事情，你真的不应该只是自动写“完成”你应该等待回应，看看它是否真的完成了。

Answer 3

意识到这是一个老问题，但我写了一个插件来解决这个问题，有人可能觉得有用。

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

允许您这样做：

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

Answer 4

delay（）不会完成这项工作。 delay（）的问题是它是动画系统的一部分，并且只适用于动画队列。

如果你想在执行动画之外的事情之前等待怎么办？

使用此：

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

会发生什么？：在这种情况下，它会在执行大括号内指定的代码之前等待600毫秒。

一旦我弄清楚这一点，这对我帮助很大，并希望它也能帮到你！

Answer 5

有一个功能，但它是额外的： http://docs.jquery.com/Cookbook/wait

这个小片段允许您等待：

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

Answer 6

您可以使用.delay()函数。
这就是您所追求的：

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

Answer 7

xml4jQuery插件提供了sleep（ms，callback）方法。其余的链将在睡眠期后执行。

$(".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>

Answer 8

我在互联网上发现了一个称为睡眠功能的函数，不知道是谁造的。在这里。

function sleep(milliseconds) {
  var start = new Date().getTime();
  for (var i = 0; i < 1e7; i++) {
    if ((new Date().getTime() - start) > milliseconds){
      break;
    }
  }
}

sleep(2000);

Answer 9

使用setTimeout函数，例如Visit here for example

jquery中的wait（）或sleep（）函数？

9 个答案: