AJAX和jQuery切换/点击状态(重置状态)

AJAX and jQuery toggle/click states (resetting state)

本文关键字：状态 jQuery 切换 AJAX      更新时间：2023-09-26

我有一个关于移动菜单的.on函数和AJAX的小问题。菜单位于AJAX内容驱动站点的页眉中，因此，如果请求AJAX调用，页眉和页脚不会被召回，但这会抛出我的移动菜单切换，因为"状态"正在丢失。

如果我点击一个图标(汉堡包图标)打开菜单，并点击相同的图标关闭，在加载网站时，它工作得很好，但一旦我点击链接导航到另一个页面，它就失去了它的状态，我得到一些奇怪的结果(但公平地说，真实的结果)，它在一次点击中打开和关闭。

我使用slideToggle()之前，但认为我会使用一个类，所以我可以删除和添加类打开菜单，然后重置类上的AJAX回调一旦页面加载成功…

$('.menu-trigger').on('click touchstart', function(e) {
    var $this = $(this);
    if ($this.is('.non-active')) {
        $('.menu-trigger').addClass('active').removeClass('non-active');
        $('.menu').addClass('open');    
    } else {
        $('.menu-trigger').removeClass('active').addClass('non-active');                $('.menu').removeClass('open');
    }
});
$(document).on('pjax:end', function() {
    $('.menu-trigger').removeClass('active').addClass('non-active');
    $('.menu').removeClass('open');
});

有没有人有过这样的经历，或者他们是如何绕过它的?

try fade toggle

   $('.element').fadeToggle('fast');
相关文章：