0

我有一个运行两个功能的 onclick,我希望第一个运行并完成,并在完成时启动下一个。我现在有这样的设置,它们似乎同时运行:

$("#animate_1").click(function() {
update_1_close();
welcome_open();
});

这是两个功能,我不想组合它们,我有几个,组合起来会很复杂

function update_1_close() {
$("#update_1").animate({
    "right": "175px",
    "width": "160px"
}, 450);
$("#update_1_caption").animate({
    "bottom": "0px"
}, 450);
$("#update_1_img").animate({
    "height": "107px",
    "width": "160px"
}, 450);
}

function welcome_open() {
$("#welcome_back_1").animate({
    "top": "345px"
}, 450);
$("#welcome_header_1").animate({
    "top": "35px",
    "left": "20px"
}, 450);
$("#welcome").animate({
    "height": "270px"
}, 450)
$("#stick_figures").animate({
    "top": "215px"
}, 450);
$("#update_1").animate({
    "top": "465px",
    "right": "175px"
}, 450);
$("#update_2").animate({
    "top": "465px"
}, 450);
$("#events").animate({
    "top": "645px"
}, 450);
$("#directions").animate({
    "top": "645px"
}, 450);
}
4

2 回答 2

2

您可以将 welcome_open 作为参数传递给 update_1_close 并在完成后执行它。由于您使用的是 jquery animate,请查看http://api.jquery.com/animate/

您正在寻找“完整”的参数。

function update_1_close( callback ) {
  $("#update_1").animate({
      "right": "175px",
      "width": "160px"
  }, 450, callback );
  $("#update_1_caption").animate({
      "bottom": "0px"
  }, 450);
  $("#update_1_img").animate({
      "height": "107px",
      "width": "160px"
  }, 450);
}


update_1_close( welcome_open );

否则,如果您知道 update_1_close 完成所需的时间,您可以使用 setTimeout (但要注意,因为您可能会在任何地方得到幻数,这似乎已经发生了)

于 2012-10-14T23:40:46.053 回答
1

它们不能同时运行——但是,它们可能一个接一个地运行,而浏览器没有机会在它们之间刷新。

我不知道这两个函数是做什么的,但你可能想要更像这样的东西:

$("#animate_1").click(function() {
    update_1_close();
    window.setTimeout(welcome_open, 1000);
});

这将运行update_1_close,然后,一秒钟后,运行welcome_open

于 2012-10-14T23:35:43.427 回答