我该如何等待点击事件完成

Question

我向元素添加了一个click事件处理程序

 $(".elem").click(function(){
       $.post("page.php".function(){
         //code1
      })
 })

然后我触发一个点击事件

$(".elem").click();
//code2

我怎样才能确保code1执行后执行code2

Answer 1

(忽略WebWorkers)JavaScript在单个线程上运行,因此您可以确保code2将始终在code1之后执行.

除非你的code1做了像Ajax调用那样异步的东西,或者setTimeout()在这种情况下触发的click处理程序将完成,然后code2将执行,然后(最终setTimeout())将运行来自Ajax调用(或其他)的回调.

编辑:对于您更新的问题,code2将始终在code1之前执行,因为正如我上面所说的,异步Ajax回调将在以后发生(即使Ajax响应非常快,它也不会在当前JS完成之前调用回调).

"我如何确保在code1执行后执行code2"

使用.click()没有参数是一个快捷方式.trigger("click"),但如果您实际上.trigger()明确调用,则可以提供将传递给处理程序的其他参数,这样您就可以执行此操作:

$(".elem").click(function(e, callback) {
    $.post("page.php".function(){
      //code1

      if (typeof callback === "function")
         callback();
   });
});

$(".elem").trigger("click", function() {
    // code 2 here
});

也就是说,在单击处理程序测试中是否已在callback参数中传递函数,如果是,则调用它.这意味着当事件"自然地"发生时将没有回调,但是当您以编程方式触发它并传递函数时,该函数将被执行.(请注意,您传递的参数.trigger()不一定是函数,它可以是任何类型的数据,您可以传递多个参数,但为此我们需要一个函数.有关详细信息,请参阅.trigger()doco.)

演示:http://jsfiddle.net/nnnnnn/ZbRJ7/1/