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

addEventListener Javascript

Object Storage Arubacloud
0 głosów
135 wizyt
pytanie zadane 23 kwietnia 2019 w JavaScript przez gucisz Nowicjusz (160 p.)

 

const item = document.querySelectorAll("item");

item.addEventListener("mouseover", function() {
  item.nextElementSibling.style.display = "block";
});

<html>
<a href="#" class="list-group-item list-group-item-action list-group-item-default">
                    <div class="item">
                        <div class="row">
                            <div class="item-img col-sm-4 col-md-3 col-lg-3">
                                <img class="img-fluid" id="obraz" src="items/1.jpg" alt="obraz" />
                            </div>
                            <div class="item-content col-sm-6 col-md-7 col-lg-7 col-xl-8">
                                <h4>Item 1</h4>

                                <p>
                                    Lorem ipsum dolor sit amet consectetur adipisicing
                                    elit. Aspernatur veritatis dolor autem inventore non
                                    similique consectetur minima illo obcaecati delectus.
                                    Lorem ipsum dolor sit amet consectetur adipisicing
                                    elit. Aspernatur veritatis dolor autem inventore non
                                    similique
                                </p>
                                <br />
                                <span class="cena">
                                    <h4>Cena: 200 zł</h4>
                                </span>
                                <button type="button" class="btn btn-success">
                                    Do Koszyka
                                </button>
                            </div>
                        </div>
                    </div>
                    <div class="popover-fluid">
                        <div class="row">
                            <div class="item-img col-6" id="pop">
                                <img class="img-fluid" src="items/1.jpg" alt="obraz" />
                            </div>
                        </div>
                    </div>
                </a>
</html>

Witam problem mój polega na tym iż ciągle wyświetla mi komunikat w konsoli że addEventListener is not a function

przedstawiłem ułamek kodu mam liste kulku itemów i dla każdego chce zrobić ukrytego diva który ma sie wyświetlić po najechaniu myszą na dany item żeby nie robić miliarda funkcji dla każdego itema postanowiłem użyć nextElementSibling 

1 odpowiedź

+1 głos
odpowiedź 23 kwietnia 2019 przez Tomek Sochacki Ekspert (227,510 p.)
const item = document.querySelectorAll("item");

tu prawdopodobnie jest błędny selektor, jeśli pobierasz po klasie to dodaj kropkę prze item.

Druga sprawa, że metoda ta zwraca kolekcję a nie pojedynczą referencję, musisz więc zastosować np. forEach aby się po niej przeiterować i zapiąc listener na każdym elemencie. Są co prawda inne sposoby, event delegation itp. ale na początek może być i zwykły forEach.

Podobne pytania

0 głosów
1 odpowiedź 512 wizyt
+1 głos
2 odpowiedzi 316 wizyt
0 głosów
1 odpowiedź 177 wizyt
pytanie zadane 11 listopada 2019 w JavaScript przez BlvckFox Gaduła (4,240 p.)

92,576 zapytań

141,426 odpowiedzi

319,652 komentarzy

61,961 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

Kolejna edycja największej imprezy hakerskiej w Polsce, czyli Mega Sekurak Hacking Party odbędzie się już 20 maja 2024r. Z tej okazji mamy dla Was kod: pasjamshp - jeżeli wpiszecie go w koszyku, to wówczas otrzymacie 40% zniżki na bilet w wersji standard!

Więcej informacji na temat imprezy 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!

...