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

JS - dodawanie i usuwanie borderu w pętli

VPS Starter Arubacloud
0 głosów
474 wizyt
pytanie zadane 24 sierpnia 2017 w JavaScript przez Alterwar Dyskutant (7,650 p.)
Witam,

na stronie dostaję liczbę X obrazów. Po kliknięciu w dany obraz pobieram jego atrybuty. Mamy pewien problem. Otóż gdy klikam na dany obraz chcę aby go oznaczyło więc nadaje mu border. Po kliknięciu w inny obraz, border  z pierwszego powinien zniknąć. Czyli zaznaczony powinien być tylko ten który jest obecnie kliknięty, a nie ten co był. Próbowałem już parę rzeczy ale niestety bezskutecznie. Myślałem coś typu, że jeśli element kliknięty to jego data-id(atrrybut jest dynamicznie wyciągany z bazy, w przykładzie nadałem tylko na sztywno) zostaję zapisane i porównane z następnym klikniętym elementem. Ma ktoś jakiś pomysł?

Tutaj mój kod: http://jsbin.com/fifolaroti/edit?css,output

3 odpowiedzi

0 głosów
odpowiedź 24 sierpnia 2017 przez Jedras Maniak (54,860 p.)
wybrane 24 sierpnia 2017 przez Alterwar
 
Najlepsza
Można tak:
https://jsfiddle.net/Lvg5r9ew/1/

Ale bardziej elegancko byłoby dodawać/usuwać klasę, która posiada obramowanie.
komentarz 24 sierpnia 2017 przez Alterwar Dyskutant (7,650 p.)
Dzięki, zrobiłem z 10 minut temu i dodaje klase :)
+1 głos
odpowiedź 24 sierpnia 2017 przez cyklop123 Bywalec (2,790 p.)
Możesz przy każdym kliknięciu 'przelecieć' pętlą po wszystkich obrazkach i wymazać border jeżeli jest, a potem dopiero dodawać do aktualnie klikniętego
komentarz 24 sierpnia 2017 przez Alterwar Dyskutant (7,650 p.)
No ale wtedy usunę również z obecnego obrazu
komentarz 24 sierpnia 2017 przez cyklop123 Bywalec (2,790 p.)
Czytaj uważnie! Usuwasz przed dodaniem do aktualnego.
komentarz 24 sierpnia 2017 przez Alterwar Dyskutant (7,650 p.)
Mój błąd :) Twój pomysł wykorzystałem ;) dzięki :)
0 głosów
odpowiedź 24 sierpnia 2017 przez turtelian Obywatel (1,760 p.)
for (var i = 0; i < getClassAttr.length; i++ ){
			getClassAttr[i].addEventListener('click', function(){
// tutaj czyszczenie bordera bym dał wszystkim elementom 
for (var i = 0; i < getClassAttr.length; i++ ){
this.style.border="none";
}
				this.style.border="3px solid #07a7d2";

            });
 };


cos takiego powinno dzialac jesli czegos nie zjebalem :)

W JS nadajesz podczas klika border ale nigdzie go nie usuwasz. Więc posłusznie zostaje. Przed dodaniem borderu mozesz dodac linijke zerujaca bordery wszystkim elementom.
Ps : chyba latwiej takie cos by bylo zrobic w css poprzez activa

komentarz 24 sierpnia 2017 przez Alterwar Dyskutant (7,650 p.)
Niestety nie działa to co podrzuciłeś. Próbowałem już w ten sposób.

Activ w css też nie zadziała bo doda i usunie border.
komentarz 24 sierpnia 2017 przez turtelian Obywatel (1,760 p.)
to juz nie rozumiem co chcesz zrobic. dodac border i go usunac czy zeby nie znikal ?
FAkt ten kod co napisalem nie dziala bo wlasnie sprobowalem to odpalic, ale moj zamysl byl taki jak uzytkownika cyklop123
komentarz 24 sierpnia 2017 przez Alterwar Dyskutant (7,650 p.)
Załóżmy mam 20 zdjęc. Klikam zdjęcie nr 1 - dostaję border. Następnie klikam zdjęcie nr. 19 dostaje border, a ze zdjęcia nr 1 border znika.

Podobne pytania

0 głosów
0 odpowiedzi 178 wizyt
pytanie zadane 24 stycznia 2017 w JavaScript przez niezalogowany
0 głosów
1 odpowiedź 366 wizyt
0 głosów
1 odpowiedź 248 wizyt
pytanie zadane 14 grudnia 2022 w JavaScript przez Dawidziu Bywalec (2,610 p.)

92,455 zapytań

141,263 odpowiedzi

319,099 komentarzy

61,854 pasjonatów

Motyw:

Akcja Pajacyk

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

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj.

Akademia Sekuraka

Akademia Sekuraka 2024 zapewnia dostęp do minimum 15 szkoleń online z bezpieczeństwa IT oraz dostęp także do materiałów z edycji Sekurak Academy z roku 2023!

Przy zakupie możecie skorzystać z kodu: pasja-akademia - użyjcie go w koszyku, a uzyskacie rabat -30% na bilety w wersji "Standard"! Więcej informacji na temat akademii 2024 znajdziecie tutaj. Dziękujemy ekipie Sekuraka za taką fajną zniżkę dla wszystkich Pasjonatów!

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...