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

Jak pobrac id dynamicznie pobranego elementu w czystym JS?

VPS Starter Arubacloud
0 głosów
916 wizyt
pytanie zadane 30 grudnia 2018 w JavaScript przez bartello88 Użytkownik (670 p.)
Stworzyłem prosta todolist którą tworzy dynamicznie nowe elementy. Chciałbym je tez dynamicznie usuwać, ale nie ostatni(lastChild), a konkretnie kliknięty. Do tego potrzebuje pobrać ID klikniętego elementu. Umiem zrobić to w przypadku elementów już będących wcześniej na stronie, a nie tych które zostaną stworzone. Kod nie działa. Poproszę o pomoc.

2 odpowiedzi

+2 głosów
odpowiedź 30 grudnia 2018 przez sebeks Mądrala (5,300 p.)
Zakładasz na listę addEventListener('click', function(e){  },false); i to "e" podane jako argument funkcji to jest event, czyli jeśli klikniesz na na coś co ma na tej liście parametr id, to w tej funkcji możesz mieć np const zmienna = e.target.id i wtedy zmienna będzie stringiem o treści równej id tego elementu. Często używa się też e.target.value.

Najlepiej wewnątrz tej funkcji wpisz sobie console.log(e) i zobacz co zawiera ten obiekt "e", bo są tam inne fajne dane które mogą się przydać jak na przykład pozycja x,y kliknięcia na ekranie i wiele innych.
komentarz 30 grudnia 2018 przez bartello88 Użytkownik (670 p.)

function addElement(){
    var newEl = document.createElement("li");
    var tekst = "sfsdfs".toUpperCase();
    newEl.innerHTML = '<li class="elementyListy" id="elementNumber'+elementumber+'"><p>'+tekst+'</p></li>';
    var parent = document.querySelector(".lista").appendChild(newEl);
    elementumber++;
}

 

 

var el = document.querySelector(".lista");
el.addEventListener("click", function(e){
    var targett = e.target;
    console.log(targett.id);
}, false);

 

Własnie coś podobnego zrobiłem ale działa tylko na elementach już wczytanych przez stronę mimo ze w stworzonych dynamicznie sa tez id.

Efekt końcowy powyżej.

 

komentarz 30 grudnia 2018 przez sebeks Mądrala (5,300 p.)
edycja 3 stycznia 2019 przez sebeks
Dawno takiego kodu nie pisałem. Po pierwsze dane, czyli elementy z listy trzymaj w zmiennej typu tablica. Po drugie wyświetlaj elementy listy iterując po tablicy. Po trzecie dodawaj (i usuwaj) elementy listy w ten sposób, że wykonuj operację na tablicy. Po czwarte, sama zmiana w tablicy nie zmieni widoku na stronie i trzeba uruchomić funkcję wyświetlającą listę po każdej zmianie danych w tablicy (czyli po dodaniu lub usunięciu listy).

Co do kodu to poczytaj gdzieś (np. Dokumentacja MDN) lub obejrzyj na Youtube (np. Samuraj programowania) i zamiast var używaj let i const.
0 głosów
odpowiedź 30 grudnia 2018 przez Rettles Bywalec (2,320 p.)
Ciężko tu jakoś pomóc, gdybyś wrzucił kod było by łatwiej, ale w takim wypadku nakieruję - poczytaj jak działa słówko this w JavaScript.

Podobne pytania

+1 głos
2 odpowiedzi 367 wizyt
0 głosów
1 odpowiedź 253 wizyt
pytanie zadane 21 września 2016 w JavaScript przez bugs55 Obywatel (1,090 p.)
0 głosów
1 odpowiedź 143 wizyt
pytanie zadane 15 lutego 2017 w JavaScript przez tatar Użytkownik (740 p.)

92,453 zapytań

141,262 odpowiedzi

319,088 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!

...