Всплытие jquery
97
21 января 2021, 14:10
Не могу понять что не так. Вроде запретил всплытие события, но "не работает".
Под всплытием имею ввиду, что от потомка события передаются родителям и т.д. Так вот, мне нужно чтоб события выполнились только у потомка и на нем все закончилось.
В результате хочу получить клик по "header-mobile-menu". Клик по "mobile-layer" НЕ должен считаться как клик по "header-mobile-menu".
Привожу пример с песочницы - [jsfiddle][1]
<div class="header-mobile-menu">
<div class="mobile-layer">123</div>
</div>
$('.header-mobile-menu').click(function (event) {
event.stopPropagation();
alert(123);
});
Спасибо!
Answer 1
События "всплывают" от детей к родителям. Вызов event.stopPropagation(); должен быть в обработчике события внутреннего элемента.
$('.mobile-layer').click(function(event) {
event.stopPropagation();
console.log(123);
});
$('.header-mobile-menu').click(function(event) {
console.log(456);
});.header-mobile-menu {
border: black solid 1px;
background: lightgreen;
padding: 30px;
}
.mobile-layer {
border: black solid 1px;
background: lightpink;
padding: 10px;
}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="header-mobile-menu">
<div class="mobile-layer">123</div>
</div>
-
10:16
-
17:54
-
22:01
-
13:03
-
12:54
Айфон мало держит заряд, разбираемся с проблемой вместе с AppLab
-
21:25
-
07:04
-
07:46
-
21:56
Перевод документов на английский язык: Важность и ключевые аспекты
ТОП-10
- Почему SERVER_ADDR имеет не тот IP 47548 visits
- Как заменить $_SERVER[REMOTE_ADDR] на IP клиента в PHP за двумя Nginx? 30491 visits
- Хочу вывести несколько строк из массива в один div, выводит только много undefined; подскажите, что делать? 23622 visits
- Как через css изменить цвет png изображения? 10345 visits
- Blob video url download 9954 visits
- Php curl запрос через прокси с авторизацией 9205 visits
- Работа с captcha vk api 8087 visits
© "hostciti.net" 17.11.2024 | 08:24