modification d'un menu existant pour des sous-menus à l'aide jquery

Question

courant I ont la structure de menu suivante définie dans une masterpage:

<asp:ContentPlaceHolder ID="SubNavigation" runat="server"> 
    <ul> 
    <li><%= RenderLink("item 1", "/item1/", null, null) %></li> 
    <li><%= RenderLink("item 2", "/item2/blah/", null, "nofollow")%></li> 
    <li><%= RenderLink("item 3", "/item3/blah/", null, "nofollow") %></li> 
    </ul> 
</asp:ContentPlaceHolder> 

Comme les gens naviguer sur le site de la méthode RenderLink obtenir appelé et vérifie si l'utilisateur est courant sur la page demandée et le rend comme tag avec css spécifique.

Maintenant, je suis désireux d'ajouter un sous-menu comme ceci:

<asp:ContentPlaceHolder ID="SubNavigation" runat="server"> 
    <ul> 
    <li><%= RenderLink("item 1", "/item1/", null, null) %></li> 
    <li><%= RenderLink("item 2", "/item2/blah/", null, "nofollow")%></li> 
    <li><%= RenderLink("item 3", "/item3/blah/", null, "nofollow") %></li> 
     <li class="topitem"> 
      <%= RenderLink("Item 4", "/Item4/blah/", null, null) %> 
      <ul class="sublist"> 
       <li class="subitem"> 
        <%= RenderLink("subitem4a", "/subitem4a/blah/", null, null) %></li> 
       <li class="subitem"> 
        <%= RenderLink("subitem4b", "/subitem4b/blah/", null, null) %></li> 
       <li class="subitem"> 
        <%= RenderLink("subitem4c", "/subitem4c/blah/", null, null) %></li> 
      </ul> 
     </li> 
    </ul> 

J'essaie d'utiliser jquery de sorte que lorsqu'un utilisateur clique sur un élément qui a la classe TopItem l'utilisateur est derected à la L'URL correspondante et le sous-menu sont alors affichés, une fois qu'un utilisateur quitte une page qui n'est pas le topitem ou des sous-menus, le sous-menu est fermé.

J'ai essayé la jquery suivante, mais ne l'ai pas eu de joie ...

$(document).ready(function() { 
    $('li.topitem > a:first-child').siblings().toggle(); 
}); 

évidemment cela a un effet d'entraînement sur de montrer/cacher les li.topitems et ses frères et sœurs qui ne sont pas bon s'il y a un autre sous-menu défini dans ma structure de menu.

Quelle est la meilleure façon de gérer cela dans jQuery?

Answer 1

Je ne suis pas sûr que cela puisse être accompli uniquement dans jQuery ou si c'est même le bon choix ici. La façon dont vous liez les fonctions jquery me semble bien.

Si vous voulez qu'un sous-menu apparaisse sur une certaine page, vous devez exécuter les éléments de liste à travers un type de boucle qui vérifie si vous êtes sur la bonne page. Le code que vous avez posté ici est essentiellement un balisage HTML.

Je ne connais pas ASP mais en PHP c'est assez simple avec une boucle if/else. Dans la boucle if, vous pouvez faire de la condition une variable passée à travers l'URL capturée par ASP.