• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

dodawanie i usuwanie klasy js

0 głosów
197 wizyt
pytanie zadane 9 stycznia w JavaScript, jQuery, AJAX przez redstar1 Bywalec (2,110 p.)

Mam sobie kilka elementów klasy list-group-item i teraz chcę zrobić aby po kliknięciu w jakiś konkretny przypisała mu się klasa active

$( ".list-group-item" ).click(function() {
  	$(this).addClass( "active" );
	});

Z tym nie ma problemu ale teraz muszę mieć jeszcze tak, że po kliknięciu w inny element to jemu się pojawia klasa active ale temu poprzedniemu znika a np removeClass pod add nie działa. Czy jest jakiś sposób aby to zrobić?

1 odpowiedź

+1 głos
odpowiedź 9 stycznia przez Kornelia Kobiela Nałogowiec (33,250 p.)
wybrane 9 stycznia przez redstar1
 
Najlepsza

Nie wiem jak to jest w jQuery, ale biorąc pod uwagę czystego JS-a, to możesz zrobić tak:

  • Bierzesz wszystkie elementy danej klasy.
  • Każdemu z nich nadajesz Event Listener na click.
  • Reakcją na zdarzenie jest nadanie klasy active właśnie klikniętemu elementowi.
  • Usunięcie wszystkim pozostałym.

JS udostępnia do tego specjalną metodę classList.toggle('nazwa klasy)', która zmienia stan kasy ( dodaje jeśli jej nie ma, odejmuje, jeśli jest). Z pewnością jQuery ma coś podobnego. Żeby wiedzieć o co mi chodzi, spójrz na kawałek mojego kodu: Github

W linii 21 jest właśnie taka funkcja, która zajmuje się dokładnie tym samym.

1
komentarz 9 stycznia przez Comandeer Mentor (364,880 p.)

Można też przypiąć jeden handler, dla całej listy i poslugiwać się event.target zamiast this (BTW w dobie ES6 i arrow function używanie this i tak raczej już nie przejdzie ;)).

Podobne pytania

0 głosów
1 odpowiedź 63 wizyt
pytanie zadane 4 lutego w JavaScript, jQuery, AJAX przez Bakr Gaduła (4,310 p.)
0 głosów
1 odpowiedź 65 wizyt
0 głosów
1 odpowiedź 48 wizyt
pytanie zadane 26 lutego w JavaScript, jQuery, AJAX przez witkobar Nowicjusz (140 p.)
Obowiązuje już zaktualizowany regulamin.

Czy wiesz, że nie musisz już odświeżać strony głównej?

Lista pytań i odpowiedzi aktualizuje się automatycznie!

38,612 zapytań

76,496 odpowiedzi

149,411 komentarzy

18,072 pasjonatów

Przeglądających: 247
Pasjonatów: 25 Gości: 222

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto dwie polecane książki warte uwagi. Pełną listę znajdziesz tutaj.

...