如何等待单击事件完成

How can I wait for a click event to complete

本文关键字：单击 事件 等待 何等待      更新时间：2023-09-26

我在元素中添加了一个点击事件处理程序

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

然后我触发点击事件

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

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

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

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

EDIT:对于您更新的问题，code2将始终在code1之前执行，因为正如我上面所说，异步Ajax回调将在稍后发生（即使Ajax响应非常快，它也不会调用回调，直到当前JS完成）。

"如何确保代码2在代码1执行后执行"

使用不带参数的.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()文档。）

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

您可以尝试这样写：

 $(".elem").live("click", function(){
  //code1
 })
 // for newer jquery version from 1.9
 $(".elem").on("click", function(){
  //code1
 })

而且，您的触发器将始终执行为已启动。

将code2封装在方法中，并将其作为回调添加到code1中，这样它将始终在code1执行后被调用

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

Javascript的执行是逐行执行的。因此，无论发生什么，都将首先执行。因此，在其他方法之前添加click代码将起作用。

另外，如果有任何异步调用，那么获取一个只有在得到响应时才设置的标志。

var点击=false；$（'#elem'）.click（function（）{//做一些异步进程点击=true；})；

while（！点击）｛//无所事事｝

//称为的其他功能

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

相关文章：