Javascript 页面加载时手风琴菜单打开

Question

我对编码非常陌生，尤其是 Javascript。我最近找到了一个教程，我必须为手风琴菜单工作，但我无法理解如何在页面加载时关闭下拉菜单。目前，所有的下拉菜单在页面加载时都是打开的。我尝试查看其他解决方案，但我还没有完全理解代码。非常感谢！

(function($){
$(document).ready(function(){

$('#cssmenu li.active').addClass('open').children('ul').show();
 $('#cssmenu li.has-sub>a').on('click', function(){
    $(this).removeAttr('href');
    var element = $(this).parent('li');
    if (element.hasClass('open')) {
        element.removeClass('open');
        element.find('li').removeClass('open');
        element.find('ul').slideUp(200);
    }
    else {
        element.addClass('open');
        element.children('ul').slideDown(200);
        element.siblings('li').children('ul').slideUp(200);
        element.siblings('li').removeClass('open');
        element.siblings('li').find('li').removeClass('open');
        element.siblings('li').find('ul').slideUp(200);
    }
});

});


})(jQuery);

Answer 1

替换

$('#cssmenu li.active').addClass('open').children('ul').show();

第 4 行

$('#cssmenu li.active').removeClass('open').children('ul').hide();

Answer 2

您仅在点击时触发展开操作。只需在 DOM 个元素上设置第一个状态。

<div style="display: none;"></div>

或者默认控制"closed"class名字而不是"open"

Javascript 页面加载时手风琴菜单打开

Javascript accordion menu open when page loads

html

javascript

css

menu

accordion