Question

我对移动菜单的.on功能和AJAX存在轻微问题。菜单位于AJAX内容驱动站点的标题中，因此如果请求AJAX调用，页眉和页脚将不会被调用，但这会导致我的移动菜单切换为“状态”＃ 39;迷路了。

如果我点击一个图标（汉堡包图标）打开菜单，然后点击相同的图标关闭，加载网站时，它工作正常，但只要我点击一个链接导航到另一个页面就会丢失它的状态和我得到了一些奇怪的结果（但公平，真实的结果），只需点击一下即可打开和关闭等。

之前我使用的是slideToggle()，但我认为我会使用一个类，所以我可以删除并添加类来打开菜单，然后在pageload成功后重置AJAX回调上的类... < / p>

$('.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');
});

有没有人有这方面的经验，也许他们是如何绕过它的？

Answer 1

尝试淡入淡出切换

   $('.element').fadeToggle('fast');

AJAX和jQuery切换/点击状态（重置状态）

1 个答案: