2013-08-14 2 views
0

Я сделал меню с подэлементами, как вы можете видеть here - jsFiddle.Как открыть элементы динамического подменю внутри подпозиций с помощью jQuery?

Он работает очень хорошо. Но, на 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> 
+0

вам придется искать в рекурсивном цикле, чтобы иметь возможность итерировать бесконечный уровень подкатегорий – hex4

+0

@ hex4 Правильно, я передам это программисту, но на моем jQuery, что мне нужно делать? как узнать, у какого элемента есть подменю, чтобы мой скрипт работал? – Preston

ответ

0

Вы можете использовать ajax функцию JQuery, чтобы получить свои подэлементы динамически. Тогда вы можете append его в свои новые списки.

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

Надеюсь, это поможет вам.