從事件觸發Ajax完成后運行jQuery

Question

我有以下代碼：

$(document).on('click', '.imageItem', function(event) {
    $(this).slideUp()
});

每當單擊.imageItem時，都會觸發一個單獨的腳本來操縱DOM，而Ajax（我對其他腳本沒有控制權）會觸發該腳本。

因此.imageTable會短暫地滑動並隱藏，但是在其他腳本完成AJAX DOM操作之后，它會重新出現。

我嘗試等待直到Ajax完成，但這不起作用：

$(document).on('click', '.imageItem', function(event) {
  $(document).ajaxComplete(function() {

    $(this).slideUp();

   });
});

我不確定為什么它不起作用。

Answer 1

您可能需要跟蹤單擊了哪個項目，然后使用該項目隱藏在ajaxComplete ：

$(document).ajaxComplete(function (event, xhr, settings) {
    if (img) {
        img.slideUp('slow');
        img = null;
    }
});

//To keep track of what item was clicked
var img = null;

$(".imageItem").on("click", function () {
    img = $(this);
});

您可以在此小提琴中看到一個有效的示例，但正如@charlietfl在注釋中指出的，如果其他腳本使用jQuery它也可以工作。