Отменить событие перехват?

Question

[Богдан]

Здравствуйте. Подскажите пожалуйста. Как правильно отменить событие перехват, когда нажимаешь на элемент child что бы не срабатывало событие на элементе parent?
Можно конечно сделать проверку "event.target === event.currentTarget", но может есть другой способ


Спасибо.

Answer 1

[Андрей]

а зачем тогда вешаете событие на родителя?
сделайте так
https://jsfiddle.net/6jxns3qd/18/

Comments

[Богдан]

Спасибо, Потому что у меня модальное окно, и при клике на parent должно закрываться, но вместе с тем что бы при клике на child оставалось. У Вас как бы немножко не так сделано.

[Андрей]

делайте тогда 2 событя click (на Parent и child) либо же проверяйте target
нормальная практика и то и другое.
Но еще лучше практика -- это не вкладывать модальное окно в фон (судя по вашему коду именно так вы и делаете). тогда не будет таких проблем

[Андрей]

либо как-то так присвоив id

document
    .querySelector('.main')
    .addEventListener('click', event => { 
        if (event.target.id === "modal") return;
        console.log("close")
      });

[Богдан]

Андрей, проще тогда сделать, тогда выйдет универсальней. Но как бы думал что есть другие варианты, но видимо их нет )
if (event.target !== event.currentTarget) return;

Answer 2

[ArmBar]

Вам нужен stopPropagation

element = document.querySelector('.child');
element.onclick = function(event)
{
	event.stopPropagation();
};

Comments

[Богдан]

Спасибо, как вариант да, а есть возможность без добавление еще одного обработчика событий?

[ArmBar]

Не очень понятно, что значит

без добавление еще одного обработчика событий

[Богдан]

ArmBar, ну получается, я делаю заглушку на child, по Вашему примеру, это и есть еще один обработчик события.