jQuery Sélecteur Cliquez fonction Aide

Question

Je suis en train d'appliquer la fonction jquery cliquez ci-dessous, mais pour une raison quelconque ne peux pas sembler obtenir le droit de sélection, à savoir:

$("ul.menu li a").click(function(){ 
    $("ul.menu li").find("a").removeAttr("id"); 
    $(this).attr("id" , "current"); 
}); 

Ceci est mon code HTML que je suis en train de appliquez-le à, i, e ,:

 <div id="sidebar"> 
      <ul class="menu noaccordion"> 
       <li> 
        <a href="#" id="current" class="topm">Home</a> 
       </li> 
       <li> 
        <a href="#" class="topm">About Us</a> 
       </li> 

Mon but est d'essayer de définir le menu courant sélectionné en utilisant id = current.

Toute aide pour obtenir un bon sélecteur jquery serait très appréciée.

Merci.

Answer 1

Que pensez-vous de cela?

$("ul.menu li a").click(function(){ 
    $(".topm").attr('id', ''); 
    $(this).attr("id" , "current"); 
}); 

Answer 2

Je ne supprimerais pas l'ID de l'élément. L'attribut ID est conçu pour représenter un seul élément dans le DOM. Vous devriez vraiment appliquer cela avec une classe à la place:

$("ul.menu li a").removeClass("currentMenu"); 
$(this).addClass("currentMenu"); 

Donc, dans votre exemple: -

$("ul.menu li a").click(function() { 
    $("ul.menu li a").removeClass("currentMenu"); 
    $(this).addClass("currentMenu"); 
}); 

Vous n'avez pas besoin d'utiliser chacun, comme l'action de removeClass sera appliquée à chaque résultat jquery du sélecteur.

Answer 3

Je vous recommande d'utiliser un nom de classe qui indique qu'un menu est sélectionné au lieu de id:

<ul> 
    <li> 
     <a href="#" class="topm selected">Home</a> 
    </li> 
    <li> 
     <a href="#" class="topm">About Us</a> 
    </li> 
</ul> 

Ensuite, votre fonction de clic pourrait ressembler à ceci:

$('ul a').click(function() { 
    $('ul a').removeClass('current'); 
    $(this).addClass('current'); 
}); 

Answer 4

Merci à tous pour votre aide mais j'ai réussi à le faire partir de mon code original plus l'ajout d'un .find ("a") sur la dernière ligne, qui a résolu mon problème, à savoir

$("#sidebar ul.menu li").click(function() { 
     $("ul.menu li").find("a").removeAttr("id"); 
     $(this).find("a").attr("id" , "current"); 
    }); 

Merci encore.