php - 子菜单 div 问题

Question

我有一个带有子菜单的菜单。这个菜单来自数据库。在主菜单的一个叮当声上打开一个子菜单..我希望当我点击子菜单的任何链接时..子菜单保持打开状态，所选子菜单应保持选中状态。但问题是当我点击任何子菜单链接时..我到达了它的相关链接..但是子菜单隐藏了。我尝试使用 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

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

假设这是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
    });
 });