Question

我制作了一个包含子项目的菜单，您可以看到here - jsFiddle。

它运作良好。但是，在PRODUTOS子项目上，我需要实现另一个子菜单。第二个“子菜单”必须是动态的，因为我将从数据库中获取，子项目有子菜单，我不知道如何在此脚本上实现它。

任何帮助？

脚本：

var sPath = window.location.pathname+window.location.search;
var sPage = sPath.substring(sPath.lastIndexOf('/') + 1);

$('dd').filter(function () {
   return $('a[href="' + sPage + '"]', $(this)).length == 0
}).hide();

$('dt a.submenu').click(function () {
   $("dd:visible").slideUp("slow");
   $(this).parent().next('dd').slideDown("slow");
   return false;
});

HTML

<div class="menu">
   <dl>
      <dt><a href="#">HOME</a></dt>
      <dt><a href="#" class="submenu">QUEM SOMOS</a></dt>
         <dd>
            <ul>
               <li><a href="#">EMPRESA</a></li>
               <li><a href="#">INSTITUCIONAL</a></li>
               <li><a href="#">NOSSOS PRODUTOS</a></li>
               <li><a href="#">RESPONSABILIDADE SOCIAL</a></li>
               <li><a href="#">RESPONSABILIDADE AMBIENTAL</a></li>
            </ul>
         </dd>
      <dt><a href="#" class="submenu">PRODUTOS</a></dt>
         <dd>
            <ul class="produtos">

               <li><a href="#">TESTE</a></li>
               <li><a href="#">TESTE</a></li>
               <li><a href="#">TESTE</a></li>
            </ul>
         </dd>
      <dt><a href="#">INFORMATIVO</a></dt>
      <dt class="no_border"><a href="#">CONTATO</a></dt>
   </dl>
</div>

Answer 1

您可以使用jquery的ajax函数动态获取子元素。然后，您可以append将其添加到新列表中。

<li><a href="#">TESTE</a><ul>here you can append your new items</ul></li>

希望它会对你有所帮助。

如何使用jQuery打开子项内的动态子菜单项？

1 个答案: