Предотвратить javascript onclick на дочерний элемент - PullRequest
6 голосов
/ 16 сентября 2009

Хорошо, простой вопрос:

<div onclick="javascript:manualToggle(this)">
    <span>Allowed to click</span>
    <span>Not allowed to click</span>
    <span>Allowed to click</span>
</div>

Не реплицируя manualToggle на 2 пролета, которым разрешено кликать, как я могу предотвратить запуск диапазона «Не разрешено кликать» по событию родительского div onclick при нажатии?

Ответы [ 6 ]

16 голосов
/ 16 сентября 2009

Присвойте span id идентификатор прикрепленного к нему события и используйте

Образец jQuery

$("#spn2").click(function(event){
  event.stopPropagation();  
});

event.stopPropagation () : останавливает передачу события родительским элементам, предотвращая уведомление любых родительских обработчиков о событии.

7 голосов
/ 16 сентября 2009

Имеет смысл использовать библиотеку, но без этого вы можете попробовать это (отредактировано для проверки всей страницы):

<html><head></head>
<body>
<script type="text/javascript"><!--
function manualToggle(val)
{
    alert(val.id);
}

--></script>

<div id="test" onclick="manualToggle(this);">
    <span>Allowed to click</span>
    <span onclick="event.cancelBubble=true;if (event.stopPropagation) event.stopPropagation();">Not allowed to click</span>
    <span>Allowed to click</span>
</div>
</body>
</html>
2 голосов
/ 16 сентября 2009

Вам нужен обработчик событий (это очень легко сделать в jQuery), который отлавливает щелчки для промежутков внутри div и запускает функцию только в том случае, если, например, промежуток имеет / не имеет определенного класса.

1 голос
/ 30 июня 2019

У меня просто была та же проблема, и я не смог заставить работать jQuery, поэтому я использовал простой Javascript:

document.getElementById("your_span").addEventListener("click", (event) => {
    event.stopPropagation();
});

Это помогло мне. Очевидно, вам нужно добавить addEventListener к каждому элементу, к которому вы хотите применить это. Поскольку я много манипулирую DOM, это не было проблемой для меня. Надеюсь, это кому-нибудь поможет:

1 голос
/ 16 сентября 2009

с mootools Вы можете использовать метод stopPropagation:

$('myChild').addEvent('click', function(ev){
    ev.stopPropagation(); // this will prevent the event to bubble up, and fire the parent's click event.
});

см. http://mootools.net/docs/core/Native/Event#Event:stopPropagation

также смотрите этот очень похожий вопрос: Как я могу остановить событие onclick от запуска родительского элемента при нажатии на дочерний элемент?

0 голосов
/ 16 сентября 2009

Возможное решение: укажите идентификаторы диапазона и проверьте, разрешено ли нажатие на выбранный идентификатор в вашей функции

плохая идея: вы не знаете, на какой интервал щелкают, поскольку вы вызываете функцию из вашего div ...

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...