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

Question

我在 jQuery 中有两个函数，我想按特定顺序触发。第一个函数是更新局部视图的 ajax 函数。另一个应该在局部视图上做一些样式，一旦 ajax 函数完成 - 这个函数需要一个参数。ajaxFunction();stylingFunction(params);我尝试了以下方法：ajaxFunction(function() {    stylingFunction(params)});另外，我尝试使用回调：ajaxFunction(stylingfunction(params));ajaxFunction(callback){    //Do update    callback()}然而，这些都不起作用。由于局部视图正在更新，样式会在它消失后不久出现。我在哪里错了？这两个函数都写在我的“父”视图中。

Answer 1

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

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

(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 事件委托的 gist，您可能想要查看并合并任何对您的情况有帮助的内容。 https://gist.github.com/inceptzero/a753d020648f49da90f8

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

Answer 2

由于您使用的是 jQuery，因此const ajaxFunc = callback => $.ajax({...}).done( data => callback)您也可以使用 async/await。您可以在MDN上阅读有关它的更多信息。