Question

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

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

然后我触发点击事件

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

如何确保code2执行后执行code2

Answer 1

（忽略WebWorkers）JavaScript在单个线程上运行，因此您可以确保code2始终在code1之后执行。

除非你的code1执行异步操作，比如Ajax调用或setTimeout()，在这种情况下触发的click处理程序将完成，然后code2将执行，然后（最终）回调来自将运行Ajax调用（或setTimeout()或其他）。

编辑：对于您更新的问题，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()传递的参数不必是函数，它可以是任何类型的数据，您可以传递多个参数，但为此我们需要一个函数。请参阅{ {3}}了解更多信息。）

演示：.trigger() doco

Answer 2

在方法中换行code2并将其添加为code1内的回调，以便在code1执行后始终调用

code2 = function(){/*code2*/};
$(".elem").click(function(){
  //code1
  code2();
 })

Answer 3

你可以尝试这样写：

 $(".elem").live("click", function(){
  //code1
 })

并且，你的触发器将始终以触发的方式执行。

Answer 4

Javascript执行是逐行的。所以无论出现什么，都会先执行。因此，在其他方法之前添加点击代码将起作用。

如果有任何异步调用，则取一个仅在收到响应时设置的标志。

var clicked = false; $（ '＃ELEM'）。点击（函数（）{ //做一些异步过程 clicked = true; }）;

while（！clicked）{//什么都不做}

//要调用的其他函数

或者第二个选项是，如果使用post方法，则在属性中设置async = true。

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

4 个答案: