javascript 如何检测 jquery 触发事件完成?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/11564494/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-26 13:41:02  来源:igfitidea点击:

How do I detect a jquery trigger events completion?

javascriptjqueryjavascript-events

提问by user1216398

I'm trying to trigger a second event dependent on the first like so:

我试图触发依赖于第一个事件的第二个事件,如下所示:

...
$('#productFamilyId').val(data.contents.productfamily);
$('#productFamilyId').trigger('change', function() {
    $('#productId').val(data.contents.product);
    $('#productId').trigger('change');
});

It's not waiting for the first trigger to complete before attempting to trigger the second event. Is it possible to wait for the first trigger to complete?

在尝试触发第二个事件之前,它不会等待第一个触发器完成。是否可以等待第一个触发器完成?

采纳答案by Reinstate Monica Cellio

There is no callback for the trigger method. The extra parameters are just that - parameters.

触发器方法没有回调。额外的参数就是 - 参数。

http://api.jquery.com/trigger/

http://api.jquery.com/trigger/

What you're actually doing is running the code in the second function and then passing the result as a parameter into the event handler called by trigger. You need to trigger the 2nd event within the event handler for the first event if you want them to run in sequence.

您实际要做的是在第二个函数中运行代码,然后将结果作为参数传递给触发器调用的事件处理程序。如果您希望它们按顺序运行,您需要在第一个事件的事件处理程序中触发第二个事件。

回答by Engineer

Probably you want this:

可能你想要这个:

$('#productFamilyId').trigger('change', function() {
   $('#productId').val(data.contents.product);
   setTimeout(function(){ 
      $('#productId').trigger('change'); 
   },1);
});

回答by Shreedhar

you can use javascripts setTimeout() function, so that the function will execute after some interval.

您可以使用 javascripts setTimeout() 函数,以便该函数将在一段时间后执行。

$('#productFamilyId').val(data.contents.productfamily);
$('#productFamilyId').trigger('change', function() {
setTimeout( function(){       
$('#productId').val(data.contents.product);
    $('#productId').trigger('change');
},100);
});

回答by Renan Araújo

If your event handler doesn't execute a asynchronous call, the triggered event will execute and finish, only then will go to the next line. JsFiddle

如果您的事件处理程序不执行异步调用,则触发的事件将执行并完成,然后才会转到下一行。JsFiddle

$('#productFamilyId').val(data.contents.productfamily);
$('#productFamilyId').trigger('change');
// Execute after change complete
$('#productId').val(data.contents.product);
$('#productId').trigger('change');

With asynchronous call(setTimeOut, Ajax etc) in the event handler you can do this: JsFiddle

通过事件处理程序中的异步调用(setTimeOut、Ajax 等),您可以执行以下操作:JsFiddle

Add a callback function as parameter in your event handler:

在事件处理程序中添加回调函数作为参数:

$("#productFamilyId").change(function(e, callback) {
    // Simulating ajax
    setTimeout(function() {
        if (typeof callback === "function")
            callback();
    }, 3000);
});

And trigger like this:

并像这样触发:

$('#productFamilyId').trigger('change', function() {
    $('#productId').val(data.contents.product);
    $('#productId').trigger('change');
});