2010-02-11 13 views
15

Mam 4 kotwice, chcę dodać klasę prądu do kotwicy po kliknięciu i usunąć klasę z pozostałych 3 w tym samym czasie. Oto mój kod. Co ja robię źle?jquery add remove class

if ($("ul#thumb a").hasClass("current") { 
    $("ul#thumb a").removeClass("current"); 
    $(this).addClass("current"); 
}); 

i mój html wygląda następująco:

<ul id="thumbs"> 
    <li> 
     <!-- intro page navi button --> 
     <a id="t0" class="active" name="t0">The Company</a> 

     <ul class="navi"> 
      <li><a style="display:none"></a></li> 
      <li><a id="t1" name="t1">The Brief</a></li> 
      <li><a id="t2" name="t2">The Solution</a></li> 
      <li><a id="t3" name="t3">The Result</a></li> 
     </ul> 

    </li> 
</ul> 
+0

Jak wygląda Twój HTML? – Sampson

+0

Co dokładnie nie działa? Czy to nie jest usuwanie klasy, czy też nie jest dodawanie klas? Ponadto nie wygląda to na pełną liczbę jQuery. Potrzebujesz jakiegoś '$ ('ul # thumb a') .Kliknij (function() {...});' aby go zawinąć. –

+0

@Topher Poprawiłem swój post, aby pokazać mój html – mtwallet

Odpowiedz

29

Używając zdarzeń delegację, tylko związania jednej obsługi dla wszystkich zdarzeń kliknięcia. Gdy kotwica (inne niż kotwy .current) został kliknięty, pozbawić .current kotwicę swojej klasie, i uczynić klikniętego kotwica nowy prąd One:

$("#thumbs").on("click", "a:not(.current)", function (event) { 
    $(".current", event.delegateTarget).removeClass("current"); 
    $(this).addClass("current"); 
}); 
+0

+1 - Dobry połów. Edytowałem post i nie widziałem, że = P –

+0

@ Jonathan Poprawiłem swój post, aby pokazać mój html – mtwallet

+0

@ Jonathan Sampson co znaczy "e.preventDefault();"? +1 przy okazji – ant

0

Myślę, że to pomoże Ci

$("a").click(function() { 
    $('a').removeClass('current'); 
    var id = $(this).attr('id'); 
    $('#'+id).addClass('current'); 
}); 
+0

Dlaczego miksujesz '$' i 'jQuery'? Powinieneś wybrać jedną i trzymać się jej. – Lix

+1

Przepraszam, że to był błąd .. Możesz użyć jednego – Raghvendra

Powiązane problemy