• 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

0 głosów
115 wizyt
pytanie zadane 24 sierpnia 2017 w JavaScript, jQuery, AJAX przez Alterwar Mądrala (7,280 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,840 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 Mądrala (7,280 p.)
Dzięki, zrobiłem z 10 minut temu i dodaje klase :)
+1 głos
odpowiedź 24 sierpnia 2017 przez cyklop123 Bywalec (2,750 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 Mądrala (7,280 p.)
No ale wtedy usunę również z obecnego obrazu
komentarz 24 sierpnia 2017 przez cyklop123 Bywalec (2,750 p.)
Czytaj uważnie! Usuwasz przed dodaniem do aktualnego.
komentarz 24 sierpnia 2017 przez Alterwar Mądrala (7,280 p.)
Mój błąd :) Twój pomysł wykorzystałem ;) dzięki :)
0 głosów
odpowiedź 24 sierpnia 2017 przez turtelian Obywatel (1,770 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 Mądrala (7,280 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,770 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 Mądrala (7,280 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 64 wizyt
0 głosów
1 odpowiedź 132 wizyt
–1 głos
1 odpowiedź 58 wizyt
Porady nie od parady
Komentarze do pytań nie służą do odpowiadania, od tego jest wydzielona sekcja odpowiedzi. Funkcją komentarzy jest natomiast możliwość uzyskania dodatkowych informacji na temat samego posta.Komentarze

66,319 zapytań

113,057 odpowiedzi

239,193 komentarzy

46,585 pasjonatów

Przeglądających: 145
Pasjonatów: 2 Gości: 143

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.

...