单击链接后保持子菜单打开

Question

如何在点击链接后使对应的子菜单保持可见状态？

我应该说即时通讯在Wordpress中使用自定义菜单 - 在Wordpress中，我为所有主菜单项添加了类“第一个”，子菜单中的所有链接都添加了“第二个”类。

的CSS的。第二是：

.second { 
    display: none; 
} 

这里是JQuery的：

$('.first > a').click(function(event) { 
    event.preventDefault(); 
}); 

$('.first').click(function() { 
    $(this).find('.second').show(); 
}); 

Answer 1

假设类似下面的代码的标记。如果项目有子菜单，则点击显示/隐藏子菜单，否则直接打开链接。

// hide all the sub menus 
 
$('#nav > li > ul').hide(); 
 

 
// show/hide sub menu if it exists 
 
$('#nav > li > a').click(function() { 
 
    var $ul = $(this).siblings('ul'); 
 
    if ($ul.length > 0) { 
 
     $ul.toggle(); 
 
     return false; 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 

 
<ul id="nav"> 
 
    <li> 
 
     <a href="#">Home</a> 
 
    </li> 
 
    <li> 
 
     <a href="#">About</a> 
 
     <ul> 
 
      <li><a href="#">Team</a></li> 
 
      <li><a href="#">Contact</a></li> 
 
     </ul> 
 
    </li> 
 
</ul>