jquery - Jquery Formatting - 在另一个完成后运行函数

Question

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

所以简而言之，我希望这段代码运行......

$('#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
          })
      }});
});