Question

我正在尝试暂停一个函数，直到另一个函数完成了它的任务。有什么类似于.ajaxComplete（）但是为了完成一个函数吗？

此代码应该首先快速打印出“test”然后减速（如果你愿意，减速）。随着循环中的数字变得更高，setTimeout变得更长，因此，当循环继续时，它打印“更慢”。基本上，我需要循环暂停，直到函数打印完毕。

编辑 - 我更新了我的代码。 “测试”只打印一次，没有其他事情发生。

 <html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
</head>
<body>

<input type="button" value="Display alert box" onclick="docWrite()" />
<script>

var b = 0;

function docWrite() {
   document.write("test");
   timeMsg();
}

function timeMsg() {
  b += 250;
  if (b < 5000) { //check the limit
     setTimeout("docWrite()", b - 250); //substract 250 (because we already added 250 before the first print
  }
}
</script>
</body>
</html>

Answer 1

我认为让超时功能启动新的超时功能会更好这将解决您的问题并完全摆脱for循环。只需调用timeMsg（）即可启动该示例。

<script>

var b = 0;

function docWrite() {
    $('body').append("test");
    timeMsg();
}

function timeMsg() {
    b += 250;
    if (b < 5000) { //check the limit
        setTimeout(docWrite, b - 250); //substract 250 (because we already added 250 before the first print
    }
}

</script>

修改自己的脚本我最终得到了这个：

<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
</head>
<body>

<input type="button" value="Display alert box" onclick="timeMsg()" />
<script>

var b = 0;

function docWrite() {
   $("body").append("test");
   timeMsg();
}

function timeMsg() {
  b += 250;
  if (b < 5000) { //check the limit
     setTimeout(docWrite, b - 250); //substract 250 (because we already added 250 before the first print
  }
}
</script>
</body>
</html>

Answer 2

您必须将回调添加到docWrite()。通过将函数传递给它来运行某些东西（或者你想要完成的东西）。

function docWrite(callback) {
    document.write('test');
    // something like
    callback();
}

然后你可以像这样构建它：

var b = 0;
function timeMsg(){
    var t = setTimeout(function () {
        docWrite(function () {
            // what to do after this finishes
            if (b > 5000) { return; }
            b += 250;
            timeMsg();
        })
    }, b);
}

Answer 3

以下功能可用于填写您的任务：

function repeat(action, initial, slowdown, count, callback) {
    function next(time) {
       window.setTimeout(function() {
          if (count--) {
             action();
             next(time+slowdown);
          }
          else
             callback();
       }, time);
    }

    next(initial);
}

您可以按如下方式使用它：

repeat(docWrite, 0, 250, 5000/250, function() {
    $("body").append("done"); 
});

function docWrite(){
    $("body").append("test");
}

请注意，如果action回调（docWrite）执行异步调用，例如您想在开始下一个计时器之前等待完成的动画，那么它会变得多一点复杂。如果是这种情况，请告诉我。

http://jsfiddle.net/JKEpK/4/

使用javascript / jquery检查函数是否已完成其任务

3 个答案: