[JavaScript][HTML]toggle show/hide |
[JavaScript][HTML]toggle show/hide |
11.09.2019, 17:42:23
Post
#1
|
|
Grupa: Zarejestrowani Postów: 680 Pomógł: 28 Dołączył: 14.08.2014 Ostrzeżenie: (0%) |
Panowie przejdę do rzeczy mam kod (online):
skrypt działa bez problemowo , chciałbym teraz edytować tekst tylko dla klikalnego ID by plusik zamienił się w " minusik " Jeżeli to zmieniam w samym switchu to edytuje mi dla wszystkich , nie wiem jak tam przekazać to ID. Ktoś podpowie ? Na pewno jakoś w ten sposób : Kod $('[data-klika="' + ID + '"]').text('plusik');
Ten post edytował casperii 11.09.2019, 20:13:45 |
|
|
11.09.2019, 21:45:34
Post
#2
|
|
Grupa: Zarejestrowani Postów: 286 Pomógł: 46 Dołączył: 10.01.2016 Ostrzeżenie: (0%) |
Nie wiem, czy taka składnia w JQuery jest dozwolona, co Ty zaprezentowałeś z tym cudzysłowem w środku.
Poczytaj po co są w ogóle stosowane w programowaniu znaki cudzysłowia i apostrofu, bo widzę, że chyba nie do końca rozumiesz - lektura do poczytania (MDN). Ogólnie, to napisz jaki dostajesz błąd, ponieważ u mnie ten błąd chyba nie występuje. Kod $("[data-klika='"+one+"']").text('plusik');
Ten post edytował Neutral 11.09.2019, 21:49:57 |
|
|
12.09.2019, 08:36:48
Post
#3
|
|
Grupa: Zarejestrowani Postów: 680 Pomógł: 28 Dołączył: 14.08.2014 Ostrzeżenie: (0%) |
@Neutral wrzuciłem stary JS, obecny masz tutaj : https://jsfiddle.net/jze9v4gp/
błędów nie rzuca, chodzi o to jak do zmiennej "one" wrzucić ten ID który był klikalny. Dobra temat nieaktualny, gdyby ktoś szukał rozwiązania to: https://jsfiddle.net/jze9v4gp/2/ Ten post edytował casperii 12.09.2019, 09:14:42 |
|
|
12.09.2019, 10:25:23
Post
#4
|
|
Grupa: Zarejestrowani Postów: 286 Pomógł: 46 Dołączył: 10.01.2016 Ostrzeżenie: (0%) |
Wprowadziłem Cię chyba w błąd, ponieważ w tym kontekście nieważne jest, czy napiszesz tak data-x="hello", czy tak data-x='hello'.
Proponuję, abyś zabrał się raczej do nauki czystego (pure) JavaScript, a nie z bibliotekami, dopóki nie opanujesz języka w stopniu zadawalającym. Kod .hiddens { display: none; box-shadow: 2px 4px 2px 4px grey; } .clicks { background: lightgreen; border: 2px outset green; display: inline-block; padding: 4px; min-width: 1em; min-height: 1em; text-align: center; user-select: none; } Kod function toggle_el(e) { let clicks = document.querySelectorAll('.clicks'); for(let i=0;i<clicks.length;i++) { let computed_style = window.getComputedStyle(document.querySelectorAll('.hiddens')[i]).getPropertyValue('display'); if(clicks[i] === e.target && computed_style == 'none') { document.querySelectorAll('.hiddens')[i].style.display = 'block'; clicks[i].style.background = 'pink'; clicks[i].textContent = '-'; } else if(clicks[i] === e.target && computed_style == 'block') { document.querySelectorAll('.hiddens')[i].style.display = 'none'; clicks[i].style.background = 'lightgreen'; clicks[i].textContent = '+'; } } } document.addEventListener('click', toggle_el, false);
|
|
|
Wersja Lo-Fi | Aktualny czas: 23.04.2024 - 21:53 |