jQuery Slide Toggle 菜单 cookie 问题

Question

我在 WordPress 中创建了一个 slideToggle 下拉菜单。我刚刚将我的代码上传到 JSFiddle。可以看demo here .

我想让切换菜单在所有子菜单上保持打开状态。我正在尝试使用 cookie。

$(document).ready(function () {
    if ($.cookie('panel') == 'open') {
        $('.dropdown-menu').slideDown();
    } else {
        $('.dropdown-menu').slideUp();
    }

    $('.fixed-navbar').on('click', '.dropdown', function () {
        $('.dropdown-menu').slideToggle(function () {
            if ($(this).is(':hidden')) {
                $.cookie('panel', 'closed');
            } else {
                $.cookie('panel', 'open');
            }
        });
    });
});

我正在使用 https://github.com/carhartl/jquery-cookie插件。

由于某种原因，它无法正常工作。

Answer 1

为什么不按照 danish443 的建议去做呢？

尝试:

var $menu_with_children = $('.menu-item-has-children > a');

$menu_with_children.on('click', function(e){
    e.preventDefault();
    var $this = $(this);
    if (!$this.parent().find('> .sub-menu').hasClass('visible')) {
        $this.parent().find('> .sub-menu').addClass('visible').slideDown('slow');
    } else{
        $this.parent().find('> .sub-menu').removeClass('visible').slideUp('slow');
    }
});

和CSS

ul.sub-menu{
    display: none;
}

你可以添加这个

$('#menu-main-menu li').each(function() {
    if($(this).find('> .sub-menu').length) {
        $(this).find('> a').append('+');
    }
}); 

而不是 + 放置向下箭头图标，这样您就可以看到哪些菜单可以展开。