JQuery功能做某事 - 暂停 - 做别的事情

Question

我正在创建一个函数，我可以执行一些jquery代码...然后暂停说... 5秒然后执行其他的东西..

这样的事情：

function myFunc() {
    var str1 = 'This is the starting text';
        var str2 = 'This is the ending text';
          $("#label").html(str1);

        //I need a pause here (5000 ms) ---

          $("#label").html(str2);

}

我怎么能在那里暂停？

Answer 1

这可以使用jQuery的queue方法

顺序完成

jQuery方式：

$('#label')
    .queue(function (n) {
        ...your code here...
        n(); //dequeue the next item in the queue
    })
    .delay(5000)
    .queue(function (n) {
        ...your second bit of code here...
        n(); //dequeue the next item in the queue
    });

虽然了解如何使用setTimeout也很好。

queue的优势在于它默认与fx队列一起使用，但您可以选择指定其他队列名称。

非jQuery方式：

function first() {
    ...your code here...
    setTimeout(second, 5000);
}
function second() {
    ...your second bit of code here...
}
first();

Answer 2

您可以使用超时来处理暂停

function myFunc() {
    var str1 = 'This is the starting text';
        var str2 = 'This is the ending text';
          $("#label").html(str1);
          var plzwait=setTimeout(function(){  $("#label").html(str2);  }, 5000);

Answer 3

不确定要完成什么，但您可能不应该尝试使其同步并暂停，这会冻结应用程序。相反，我建议您使用超时，在给定的时间后执行您想要的代码。

function myFunc() {
    var str1 = 'This is the starting text';
        var str2 = 'This is the ending text';
          $("#label").html(str1);

          setTimeout(function() { 
             // Do what you want to do after a certain time in here 
             $("#label").html(str2); 
          }, 5000);

}

Answer 4

jQuery有delay(），它接受毫秒并使用效果。

这是一个示例，当文本发生变化以引起注意时，淡入淡出。

var str1 = "I am the first string";
var str2 = "This is the second string!";
var label = $("#label")
    label.html(str1).delay(5000).fadeOut("fast",function(){label.html(str2)}).fadeIn("slow");

jsFiddle Example

Answer 5

使用setTimeout();

function myFunc() {
    var str1 = 'This is the starting text';
        var str2 = 'This is the ending text';
          $("#label").html(str1);

        //I need a pause here (5000 ms) ---
        setTimeout(function(){
         $("#label").html(str2);
        },5000);


}