javascript - 事件触发 ajax 后运行 jQuery

Question

我有以下代码:

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

每当单击 .imageItem 时，一个单独的脚本就会触发 Ajax(我无法控制其他脚本)来操作 DOM。

因此 .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);
});

您可以在this fiddle中看到一个工作示例。 ，但正如 @charlietfl 在评论中指出的，如果其他脚本使用 jQuery，它就可以工作。