Chefranov
@Chefranov
Front-End, Back-End

Почему по клику на дочерним закрывает родительский элемент?

Имеется код модального окна
<div class="modal-window">
        <div class="modal-container">
            <div class="modal-cell">
                <div class="modal-block">
                    <div class="modal-close"></div>
                    <div class="modal-title">Заголовок</div>
                    <div class="modal-content">
                        Контент
                    </div>
                </div>
            </div>
        </div>
    </div>

$('.modal-close, .modal-window').click(function (e) {
            e.preventDefault();
            $(".modal-window").hide();
        });

Почему по клику внутри блока .modal-content всё закрывается? По идее должно всё закрываться только по клику на область .modal-close и .modal-window.
  • Вопрос задан
  • 164 просмотра
Решения вопроса 1
Stalker_RED
@Stalker_RED
$('.modal-close, .modal-window').click(function (e) {
  if (this === e.target) {
    $(".modal-window").hide();
  }
});
https://jsfiddle.net/5xxk4087/1
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
@grinat
Потому что обработчик висит на modal-window, а modal-content это child от modal-window. Вызываются слушатели от child к родителю, там есть параметр, он порядок вызова меняет на от родителя к child. Но в jquery по моему достаточно явно указать селектор вызываемого элемента в on.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы