等待功能完成后再重新开始答案

【问题标题】：Wait for function to finish before starting again等待功能完成后再重新开始
【发布时间】：2010-12-22 22:35:38
【问题描述】：

早安，

每次用户按下按钮时，我都会尝试调用相同的函数。这是目前发生的事情..

用户点击按钮 -> 调用函数 -> 函数需要 1000ms+ 才能完成（由于 jQuery 和 AJAX 调用的动画）

我想要发生的是每次用户按下按钮时，它会将函数添加到队列中，等待上一个调用完成，然后开始..

这可能吗？

对不起，如果我的解释有点混乱..

谢谢马修

【问题讨论】：

你想对动画和 ajax 进行排队吗？

标签： javascript jquery ajax settimeout

【解决方案1】：

由于函数是对象，它们可以存储属性。您可以让您的函数在每次调用（按下按钮）时为其自身增加一个“队列”属性，然后在函数执行结束时检查自身的队列属性是否> 0，如果是，则减少队列属性一个，然后使用 setTimeout 再次调用自己。

【讨论】：

最好的方法是调用 setTimeout。否则，这是堆栈溢出的秘诀。 ;-)
+1 @draeton 好点！当/如果函数最后调用自己，它应该在 setTimeout 中完成，延迟小至零。
@draeton：确实，这还有一个好处是浏览器的渲染引擎可以做一些事情（并且避免了“脚本 Y 似乎忙了一段时间。杀死它？”的邪恶框）跨度>

【解决方案2】：

您可以为制作动画的函数添加一个回调函数，一旦动画完成回调，它就会被调用，这样您就可以做您想做的事了。

以下是 jquery 文档中的示例：

$('#clickme').click(function() {
  $('#book').animate({
    opacity: 0.25,
    left: '+=50',
    height: 'toggle'
  }, 5000, function() {
    // Put your code here, so it will be executed once the animation completes
  });
});

P.S.：早上好？快半夜了;D

【讨论】：

:D 这里也快午夜了。顺便说一句，我想他事先并不知道（当动画完成时）按钮是否被再次按下。

【解决方案3】：

您可以跟踪每次用户按下按钮时添加到队列的全局队列/数组，然后您需要在函数中进行回调（例如在 jQuery 的 success 回调中）检查队列并调用队列中的下一个函数。

【讨论】：

不需要全局命名空间污染：只需为与之工作的对象添加一个属性。

【解决方案4】：

我最近不得不在自己的应用程序中执行此操作。我给你的最好建议是（假设你已经在 JavaScript 函数中调用了 AJAX 调用）将回调函数参数传递给你的 JavaScript 函数。然后，在您的 AJAX 调用的 success 部分中，调用您的回调函数。

示例：

// In HTML <script> tags.
$(document).ready(function () {
    $("button#queue").click(function() {
        GetMembers(GetGroups(), MemberCallback));
    });
});

function GetMembers(userId, callback) {
    $.ajax({
        //Initialized AJAX properties
        url: "/My/Project/Ajax/Page.extension",
        data: "{ 'groupId':'" + groupId + "'}",
        success: function (result) {
            callback(result.d);
        }
    });
}

function MemberCallback(members) {
    // Do your thing here.
}

【讨论】：

【解决方案5】：

当他们点击按钮时禁用它。当 ajax 例程完成时启用它。

【讨论】：