时间戳

首页 > 解决方案 > 在 Ajax 调用后触发 jQuery - 插件 Ajax 分层导航 - WooCommerce

javascript - 在 Ajax 调用后触发 jQuery - 插件 Ajax 分层导航 - WooCommerce

问题描述

经过搜索，我发现了类似的问题，但没有一个与我的问题或适合我的解决方案直接相关。我的 jQuery 知识不是太强，所以它可能是不错的和简单的。

开始...

• 我有一个 WooCommerce 网站并安装了 Ajax 分层导航插件来过滤类别。

• 要为这些添加特定样式，我使用以下 jQuery 函数为每个 li 添加一个类

$('.checkboxes li').each(function(){
$(this).addClass("filter_" + $(this).text());
});

• 在选择过滤器之前，这非常有效。

• 重新加载页面后，上述类将被删除。

• 我已经考虑过围绕 ajaxSuccess 和 ajaxComplete 组合许多不同的选项，但是无法重新启动该功能。

我需要知道的是如何重新触发上面的事件，以便每次通过 ajax 重新加载/过滤页面时，都会将适当的类添加到该 li。

这是发生 Ajax 之前的代码，所有 li 都有正确的类

这张图片显示了点击过滤器后的李氏

$( document ).ajaxComplete(function( event,request, settings ) { 
    $( "#products" ).append( "<li>Request Complete.</li>" ); 
});

$( document ).ajaxSuccess(function() { 
    $('.checkboxes li').each(function(){
        $(this).addClass("filter_" + $(this).text());
    });
}); 

$(document).ajaxSuccess(function(){ 
    alert("AJAX request successfully completed");
});

非常感谢您的帮助！

标签： javascriptjqueryajaxwordpresswoocommerce

解决方案

您是否尝试过在 ajax 完成后设置超时？ 

$( document ).ajaxComplete(function() { 

    setTimeout(function(){ 

      alert("Ajax done"); 

      $('.checkboxes li').each(function(){
        $(this).addClass("filter_" + $(this).text());
      });

    }, 500); 

});

推荐阅读