Question

我有一个带子菜单的菜单..这个菜单来自Data Base。在clink主菜单之一子菜单打开..当我点击子菜单的任何链接时，我希望它。子菜单保持打开状态，所选子菜单应保持选中状态。但问题是，当我点击任何子菜单链接..我到达它的相关链接..但子菜单得到隐藏。我尝试使用J-query这样做..但由于加载新页面而失败...请告诉我任何方式这样做..现在我想使用jquery或ajax解决方案

Answer 1

在阅读完您的问题后，我认为这可能会对您有所帮助。

使用jQuery（包括jQuery库）。
在页面上，您要保留所选的主菜单和子菜单，请执行以下操作：
1. 获取主菜单和子菜单ID并使用jQuery进行切换。

 $("#mainmenuid").toggle('fast');
 $("#submenu").toggle('fast');

或者你可以应用任何jQuery事件。

注意： 在该特定网页的标题区域添加jQuery。

Answer 2

你可以试试这个：

$('#menu > li > a').click(function(){
    if($(this).siblings('ul').length > 0){
       $(this).siblings('ul').show();
       return false; // This will do what you want.
    }
});

如果有任何兄弟“ul”元素，这将不允许链接。否则，它将转到它的href。

在这里测试： http://jsfiddle.net/SXKG4/2/

Answer 3

如果你想要一个ajax解决方案，你可以尝试load：

假设这是html：

<ul id='main-menu'>
    <li><a href='pages/home.html'>Home</a></li>
    <li><a href='pages/about.html'>About us</a>
         <ul class='sub-menu'>           /*initially hide it display:none;*/
             <li><a href='pages/subpage1.html'>sub link 1</a></li>
             <li><a href='pages/subpage2.html'>sub link 2</a></li>
         </ul>
    </li>
</ul>

<div id='content'></div> <!--here you have to put page contents-->

然后你可以使用这个jQuery：

 $(function(){
    $('#main-menu li').click(function(){
       var page = $(this).find('a').attr('href');
       $('#content').load(page);
       $('.submenu',this).toggle();
    });

     $('#main-menu a').click(function(e){
         e.preventDefault(); // <-----this stops page to navigate to link href
     });

    $('.submenu li').click(function(ev){
       ev.stopPropagation(); //<----stops the event bubbling to the parent
    });
 });

子菜单div问题

3 个答案:

假设这是html：

然后你可以使用这个jQuery：