jquery切换子菜单但如果子菜单页面处于事件状态则保持子菜单打开

Question

只是想深入研究 jquery，如果这个问题已经得到解答，请原谅我。已搜索但找不到与我正在尝试做的事情相关的示例。

我有一个带有一些子菜单的垂直菜单。当点击顶级菜单时，子菜单会打开。问题是我希望子菜单在单击其中一个子菜单项时保持打开状态。就像现在一样，当单击子菜单项时，菜单会折叠。

这是我的代码:

// Add class of drop if item has sub-menu
$('ul.sub-menu').closest('li').addClass('drop');

// Left Sidebar Main Navigation
var menu_ul = $('.menu > li.drop > ul'),
    menu_a  = $('.menu > li.drop > a');

menu_ul.hide();

menu_a.click(function(e) {
    e.preventDefault();
    if(!$(this).hasClass('active')) {
        menu_a.removeClass('active');
        menu_ul.filter(':visible').slideUp('normal');
        $(this).addClass('active').next().stop(true,true).slideDown('normal');
    } else {
        $(this).removeClass('active');
        $(this).next().stop(true,true).slideUp('normal');
    }
});

我认为如果我尝试将我想要的内容翻译成清晰的编码器类型的句子，它会像这样读起来。基本上我需要在 DOM 中查询任何具有子菜单的事件菜单，如果页面显示子菜单项之一，则显示子菜单下拉列表。

Answer 1

我认为你有两个选择。

1. 考虑使用 Ajax 加载您的页面
2. 模拟每个页面的点击事件。

例如:

对于“投资组合”项目添加此

<script type="text/javascript">
  $(document).ready(function(){
      jQuery('#menu-item-38>a').trigger('click');
  });
</script>

对于“关于我们”:

<script type="text/javascript">
  $(document).ready(function(){
      jQuery('#menu-item-180>a').trigger('click');
  });
</script>