[jQuery] Zwielokrotniony wydruk treści przez JS |
[jQuery] Zwielokrotniony wydruk treści przez JS |
27.11.2017, 13:20:23
Post
#1
|
|
Grupa: Zarejestrowani Postów: 1 840 Pomógł: 226 Dołączył: 20.03.2005 Skąd: Będzin Ostrzeżenie: (0%) |
Mam prośbę w rozwiązaniu problemu powielania treści przez JS
Problem pojawia się gdy w kodzie HTML pojawia się więcej niż 1 pozycja. Każda kolejna zwiększa powieloną treść. Np. dodamy 3 pozycję, a potem zmienimy wartość w pierwszej 3 razy, to będzie coś takiego: Kod [1.1 ] Pozycja 3 S: POLICZ 1 IDP: 1 Pozycja: 2 [1.1 ] Pozycja 3 S: POLICZ 1 IDP: 1 Pozycja: 2 [1.1 ] Pozycja 3 S: POLICZ 1 IDP: 1 Pozycja: 2 [2.2 ] Pozycja 3 S: KALKULUJ 1 IDP: 1 Pozycja: 3 [2.2 ] Pozycja 3 S: KALKULUJ 1 IDP: 1 Pozycja: 3 [2.2 ] Pozycja 3 S: KALKULUJ 1 IDP: 1 Pozycja: 3 [3.3 ] Pozycja 3 S: OBLICZ 1 IDP: 1 Pozycja: 1 [3.3 ] Pozycja 3 S: OBLICZ 1 IDP: 1 Pozycja: 1 [3.3 ] Pozycja 3 S: OBLICZ 1 IDP: 1 Pozycja: 1 Ogólnie jest logiczne bo mam taki fragment kodu:
Jednakże potrzebuję pomoc, aby móc wyłuskać tylko tą pozycję która w danej chwili zmienia swoją wartość. https://jsfiddle.net/tomplus/o6b6p4dx/5/ Ogólnie mógłbym zostawić, bo to więklszego problemu nie robi gdy użyje funkcji .html(), ale w przypadku stosowania .append() będzie pojawiać się nieproszona treść. |
|
|
27.11.2017, 13:31:59
Post
#2
|
|
Grupa: Zarejestrowani Postów: 6 762 Pomógł: 1822 Dołączył: 11.03.2014 Ostrzeżenie: (0%) |
Na przycisk dodający pozycję podłączasz znów zdarzenia do wszystkich selectów.
1. Albo użyj delegacji zdarzeń przy selectach (wtedy nie dodawaj zdarzenia change w środku obsługi zdarzenia click przycisku) 2. Albo zapisuj sobie w danym select, że właśnie dodałeś do niego zdarzenie. Dodawanie zdarzenia change musiałbyś wtedy zrobić w pętli i sprawdzić czy select w danej iteracji miał już dodane zdarzenie. 3. Albo przy dodawaniu zdarzenia dodaj do niego klasę, a selektor select.wyborPozycji zmień na select.wyborPozycji:not(.klasa). -------------------- |
|
|
27.11.2017, 14:21:01
Post
#3
|
|
Grupa: Zarejestrowani Postów: 1 840 Pomógł: 226 Dołączył: 20.03.2005 Skąd: Będzin Ostrzeżenie: (0%) |
Szczerze mówiąc, nie rozumiem, szczególnie punktu 1.
Aktualnie każdy SELECT ma dwie unikalne atrybuty: name=wybor[%s] oraz data-pozycja-id=%s Dlatego rozwiązaniem logicznym jak dla mnie byłoby znalezienie wartosci z atrybutu data-id-pozycji, w tagu nadrzędnym^2 i znajduję, dzięki: var idp = $(this).parent().parent().data('idPozycji'); ale gdybym znalazł przed funkcją .change(), to nie wiem jak. |
|
|
27.11.2017, 14:37:06
Post
#4
|
|
Grupa: Moderatorzy Postów: 36 459 Pomógł: 6297 Dołączył: 27.12.2004 |
Przeciez masz obiekt swiezo dodanego bloku wiec to
$('select.wyborPozycji').on('change', function() { masz robic tyko na tym bloku a nie na wszystkich. Od biedy dodaj to raz przez .on() i po sprawie -------------------- "Myśl, myśl, myśl..." - Kubuś Puchatek || "Manual, manual, manual..." - Kubuś Programista "Szukaj, szukaj, szukaj..." - Kubuś Odkrywca || "Debuguj, debuguj, debuguj..." - Kubuś Developer |
|
|
27.11.2017, 14:37:11
Post
#5
|
|
Grupa: Zarejestrowani Postów: 6 762 Pomógł: 1822 Dołączył: 11.03.2014 Ostrzeżenie: (0%) |
Nie ma to znaczenia, id znajdujesz w środku obsługi zdarzenia i tak samo będziesz robić, kiedy wyprowadzisz obsługę zdarzenia change na zewnątrz click.
Nie rozumiem jednak jednej rzeczy. Czemu nie nadajesz jednemu elementowi (nadrzędnemu) id, tylko pozycje podrzędne <select> i OBLICZ mają powtórzone id. A skoro je mają, to czemu nie korzystasz z tego id, tylko szukasz w elemencie nadrzędnym? -------------------- |
|
|
27.11.2017, 14:45:53
Post
#6
|
|
Grupa: Moderatorzy Postów: 36 459 Pomógł: 6297 Dołączył: 27.12.2004 |
dobra, masz
https://jsfiddle.net/0kacyru1/ strasznie to pokreciles. Na szybko dodalem poprostu off by wyzerowac wszystko co nadaowales wczesniej -------------------- "Myśl, myśl, myśl..." - Kubuś Puchatek || "Manual, manual, manual..." - Kubuś Programista "Szukaj, szukaj, szukaj..." - Kubuś Odkrywca || "Debuguj, debuguj, debuguj..." - Kubuś Developer |
|
|
27.11.2017, 14:49:21
Post
#7
|
|
Grupa: Zarejestrowani Postów: 1 840 Pomógł: 226 Dołączył: 20.03.2005 Skąd: Będzin Ostrzeżenie: (0%) |
Ogólnie to kod eksperymentalny.
Dlatego nie używam wartosci z button OBLICZ (stricte button dotyczy pola input, gdzie mam dokładnie ten sam problem, też powielają się wartości) @Nospor Chodziło Ci - JESZCZE raz .on()? |
|
|
27.11.2017, 14:50:55
Post
#8
|
|
Grupa: Zarejestrowani Postów: 6 762 Pomógł: 1822 Dołączył: 11.03.2014 Ostrzeżenie: (0%) |
nospor'owi chodziło o delegację zdarzeń, którą proponowałem Ci w punkcie 1.
-------------------- |
|
|
27.11.2017, 14:51:29
Post
#9
|
|
Grupa: Moderatorzy Postów: 36 459 Pomógł: 6297 Dołączył: 27.12.2004 |
Cytat @Nospor Nie, nie dolukalem ze masz tam juz on, ktore notabene walisz totalnie bez sensu w petli... Chyba nie zaczailes idei .on()Chodziło Ci - JESZCZE raz .on()? Tak czy siak podalem ci linka do kodu, ktory dziala (chyba) jak chcesz -------------------- "Myśl, myśl, myśl..." - Kubuś Puchatek || "Manual, manual, manual..." - Kubuś Programista "Szukaj, szukaj, szukaj..." - Kubuś Odkrywca || "Debuguj, debuguj, debuguj..." - Kubuś Developer |
|
|
27.11.2017, 15:33:46
Post
#10
|
|
Grupa: Zarejestrowani Postów: 1 840 Pomógł: 226 Dołączył: 20.03.2005 Skąd: Będzin Ostrzeżenie: (0%) |
Widzę że dodałeś prosty kod:
Kod $('select.wyborPozycji').off(); (Swoją drogą, międzyczasie doczytałem w manualu jQuery o tym, ale nie użyłem jej, bo nie wiedziałem że to rozwiąże problem) Właśnie, problemem dla mnie jest pominięcie dla tego kodu pętli. I nie wiem jaką drogą musiałbym iść aby osiągnąć ten sam efekt inaczej. |
|
|
27.11.2017, 16:09:16
Post
#11
|
|
Grupa: Moderatorzy Postów: 36 459 Pomógł: 6297 Dołączył: 27.12.2004 |
.on() masz odpalac tylko raz a nie w petli. Na tym polega jego magia, ze ta metoda lapie rowniez przyszle elelemnty, ktore dopiero sie pojawia.
Prosze https://jsfiddle.net/jja7y9p8/ -------------------- "Myśl, myśl, myśl..." - Kubuś Puchatek || "Manual, manual, manual..." - Kubuś Programista "Szukaj, szukaj, szukaj..." - Kubuś Odkrywca || "Debuguj, debuguj, debuguj..." - Kubuś Developer |
|
|
27.11.2017, 16:19:04
Post
#12
|
|
Grupa: Zarejestrowani Postów: 6 365 Pomógł: 1114 Dołączył: 30.08.2006 Ostrzeżenie: (0%) |
Poczytaj https://prophp.pl/article/28/propagacja_i_d...en_w_javascript oraz artykuł wcześniej tam podlinkowany. Jak tego nie zrozumiesz to nawet nie ma co się zabierać za pisanie kodu js bo zdarzenia to podstawa.
-------------------- |
|
|
27.11.2017, 18:16:12
Post
#13
|
|
Grupa: Zarejestrowani Postów: 1 840 Pomógł: 226 Dołączył: 20.03.2005 Skąd: Będzin Ostrzeżenie: (0%) |
Jutro przeanalizuje ten kod, ale już coś rozumiem.
Artykuł również jest bardzo wartościowy. Także jutro na spokojnie przeczytam ponownie. Dziękuję za pomoc. |
|
|
Wersja Lo-Fi | Aktualny czas: 4.05.2024 - 09:32 |