[damiano_polishiano]

#javascript

Mireczki,

2 pytania.
Jedno o event delegation. Mam taki kod: https://codepen.io/DamianL/pen/BmErGg
Dlaczego kliknięcie w obszar obrazka nie wywołuje eventu i jakbym mógł to naprawić? Czy to capturing?

Drugie:
mam taki kod: https://codepen.io/DamianL/pen/NwVvyN
Chodzi o funkcję clickAnchor() - mógłby ktoś mnie naprowadzić jak mam postąpić, by ta funkcja zwracała wartości zmiennych z zagnieżdżonej funkcji (click), tak abym mógł te zmienne wykorzystać w kolejnej funkcji?

[Michuy]

@damiano_polishiano: w pierwszym:

 if (ev.target.nodeName === 'IMG') {

a drugie nie do końca jest dla mnie jasne

[damiano_polishiano]

@Michuy: ale ja chcę noda A a nie IMG ( ͡° ͜ʖ ͡°)

[Michuy]

@damiano_polishiano

let elems = document.querySelectorAll("a");
for(let elem of elems){
    elem.addEventListener('click', ev => alert('event został wywołany!'), false);
}

[damiano_polishiano]

@Michuy: no ale tu już nie jest event delegation

[ikold]

@damiano_polishiano: Click event nie zwraca w tym przypadku elementu, zamiast tego zwraca "wierzchni" kliknięty element czyli obrazek(można to łatwo zaobserwować dodając console.log(ev.target) do pierwszej linijki funkcji). Możesz albo dodać warunek w postaci ev.target.parentNode.nodeName === 'A', odnoszący się do elementu nadrzędnego względem elementu klikniętego, albo zrobić to jak @Michuy zasugerował. Drugi sposób to po prostu event delegation dla każdego elementu 'a'(w razie jak byś nie znał tego zapisu to ev => {}

[damiano_polishiano]

@Michuy: @ikold:
właśnie rozwiązałem problem.
Nic nie trzeba było zmienić w JS. wystarczyło dodać:

img {
 pointer-events: none;
}

w CSS. Ale dziękuję za zaangażowanie ( ͡° ͜ʖ ͡°)