Jquery 格式化 - 在另一个函数完成后运行函数

Question

我有两个 jQuery 函数。我想先运行下面的第一个，然后在该函数完成后运行另一个。通常我会在代码的第一部分添加一个函数，但不确定如何使用这个 block 来做到这一点，或者它是否是正确的方法。

简而言之，我希望这段代码能够运行...

$('#setupPanel').modal({
        backdrop: "static",
        keyboard: false
});

此函数完成执行后...

$('html, body').animate({
        scrollTop: $("#header_wrap").offset().top
}, 600);

编辑:这是整个函数...

$(setUp).click(function () {
    $('html, body').animate({
        scrollTop: $("#header_wrap").offset().top
    }, 600);
    $('#setupPanel').modal({
        backdrop: "static",
        keyboard: false
    });
});

Answer 1

您可以尝试promise()方法:

$(setUp).click(function () {
    $('#setupPanel').modal({
        backdrop: "static",
        keyboard: false
    }).promise().done(function() {
        $('html, body').animate({
            scrollTop: $("#header_wrap").offset().top
        }, 600);    
      });
});

更新:

您还可以使用.animate()方法的回调函数:

$(setUp).click(function () {
        $('html, body').animate({
            scrollTop: $("#header_wrap").offset().top
        }, 600, function() {
          $('#setupPanel').modal({
              backdrop: "static",
              keyboard: false
          })
      }});
});