你如何让 JQuery 等到前一个事件被触发

Question

我有一个 div 列表，每当我单击它们时，我都会调用一个函数，其中一些会触发其他 ajax 函数。 现在虽然点击甚至触发了一个 ajax 事件，但如果我点击另一个 div，我会调用最后一次点击的 div 函数。如何解决这个问题。

document.addEventListener("click",function(event){
                checkparent(event);

    } 

function checkpaternt(event){

    if(($(event.target).class=="checkparent"){//call ajax functions
    }
    else {//call local functions}

稍后我检查目标的类名并调用不同的函数。 更多信息（有很多 div 元素和 if else 语句） 谢谢。

Answer 1

使用布尔标志：（并修复您的代码）

function checkparent(event) {
    if (ajaxRequestOn) return;
    if (event.target.className == "checkparent") {
        ajaxRequestOn = true;
        //call ajax functions
        $.ajax( /* ...*/ ).always(function () {
            ajaxRequestOn = false;
        });
    } else {
        //call local functions
    }
}

Answer 2

我认为以下示例可能会对您有所帮助。

callbacks = [$.Deferred(), $.Deferred()];
    obj1.on('click', callbacks[0].resolve);
    obj2.on('click', callbacks[1].resolve);

    $.when(callbacks).done(function() { console.log('After to events done'); });

这里我创建了两个延迟对象。

每个事件都会解析一个延迟对象。

当这些所有延迟对象将被解析时，您可以在.done() 中编写下一个函数

Answer 3

我认为element.type会帮助你，

HTML

<input type="text" id="tipo-imovel" />

脚本

$("#tipo-imovel").on("click change", function(event){
    alert(event.type + " is fired");
});

此代码将提醒已触发的事件

我建议你看看this possible events

如果对你有帮助，请告诉我

Answer 4

这可能会有所帮助：jQuery queues。请继续下面的相关报价：

这里如何使用 jQuery 队列

工作示例

This 是关于使用队列进行自定义 ajax 调用的绝佳资源。我知道存档链接内容的 SO 偏好，但我不能在这里复制代码，所以我还做了一个小小提琴显示自定义队列 - here

该示例使用文本颜色更改，但这很容易成为任何 AJAX 调用。 setTimeout 有一个类似于许多 AJAX 调用的异步回调，这个 fiddle 应该是一个有用的模板...

理论

$('#elementId').click(function (e) {
  var $element = $(e.currenttarget);
  $element.queue('myqueue', function () {
    var $el = $(this);

    //Do stuff on $el

    //Remove this event from the queue and process next...
    $el.dequeue();
  });
});

分解：

1. 监听点击事件
2. 获取点击的特定元素
3. 在此元素的“myqueue”上排队一个函数
4. 要排队的函数可能需要对该元素的引用 - 幸运的是 jQuery 将所需元素作为“this”指针调用它。

如果您希望两个事件之间有间隔，您甚至可以将出队置于像 window.setTimeout(500, function () { $this.dequeue(); }); 这样的超时内，这会在下一个事件之前设置 500 毫秒的间隔...

jQuery 队列文档

此功能类似于提供带有 动画方法，但不需要在 动画执行的时间。

$( "#foo" ).slideUp(); $( "#foo" ).queue(function() {  
  alert( "Animation complete." );   
  $( this ).dequeue(); 
}); 

这相当于：

$( "#foo" ).slideUp(function() {   
  alert( "Animation complete."
); }); 

请注意，当使用 .queue() 添加函数时，我们应该 确保最终调用 .dequeue() 以便下一个函数 行内执行。

更新答案已被修改，包括一个工作小提琴和一些解释。