jQuery 在新的触发之前等待一个函数完成

Question

我在 jQuery 中有两个函数，我想按特定顺序触发。第一个函数是更新局部视图的 ajax 函数。另一个应该在部分视图上做一些样式，一旦 ajax 函数完成 - 这个函数有一个参数。

ajaxFunction();
stylingFunction(params);

我尝试了以下方法：

ajaxFunction(function() {
    stylingFunction(params)
});

此外，我尝试使用回调：

ajaxFunction(stylingfunction(params));

ajaxFunction(callback)
{
    //Do update
    callback()
}

然而，

None 确实有效。由于部分视图正在更新，因此样式很快就会消失。我哪里错了？

这两个函数都写在我的 "parent" 视图中。

Answer 1

由于您使用的是 jQuery，因此您可以 const ajaxFunc = callback => $.ajax({...}).done( data => callback) 您也可以使用 async/await。您可以在 MDN.

上阅读更多相关信息

Answer 2

您可以使用链接到 $.ajax 调用的 .done() 和 .fail() ...

我在 successCallback() 中用伪代码创建了几个回调函数，因为你说你只需要运行样式函数 "sometimes"。您需要测试该函数内的任何条件以确定是否要运行样式函数。希望这可以帮助。

(function($) {
  $(function() {   //document.ready

    $.ajax({ cache: false,
        url: "/blah/vlah/lah",
        data: { somedata: somedata }
    })
    .done(successCallback)
    .fail(failCallback);

  });

    function successCallback(data) {
        if (someCondition) {
            stylingFunction(params);
        }
    };

    function failCallback(jqXHR, status, error) {
        console.log(jqXHR);
        console.log(error);
        console.log(status);
    };

})(jQuery);

我创建了另一个处理 ajax 事件委托的要点，您可能想要查看并合并任何对您的情况有帮助的内容。 https://gist.github.com/inceptzero/a753d020648f49da90f8

我还在 github 上为 ajax 请求队列创建了这个要点，它更加优雅和健壮。 https://gist.github.com/inceptzero/e64756f9162ca6aeeee5

jQuery 在新的触发之前等待一个函数完成

jQuery wait for a function to complete before new fires

javascript

jquery

asp.net-mvc-4