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?
@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 => {}
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?
if (ev.target.nodeName === 'IMG') {
a drugie nie do końca jest dla mnie jasne
let elems = document.querySelectorAll("a");
for(let elem of elems){
elem.addEventListener('click', ev => alert('event został wywołany!'), false);
}
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 ( ͡° ͜ʖ ͡°)