@Spiriiit

Как не выполнять событие при клике на некоторые дочерние элементы?

Здравствуйте. Подскажите, пожалуйста, как при клике на ссылку не выполнять go_1()?
Возможно это реализовать деликатно без setTimeout?
P.s. Желательно без внесения изменений в go_2();
Вот тут накидал: https://jsfiddle.net/we9vtrfq/

<div id="div">
 Test...<br>
    <a onclick="go_2()">go ></a>
    <br><br>
</div>

<div>
</div>
        
<script>
function go_1(){
    $('div').eq(1).append('go_1<br>');   
}
    
function go_2(){
    $('div').eq(1).append('go_2<br>');
}    
    
$('#div').click(function(){
  go_1();
});    
</script>
  • Вопрос задан
  • 1118 просмотров
Решения вопроса 1
Stalker_RED
@Stalker_RED
Два варианта:
Либо в go_2 использовать stopPropagation() чтобы остановить всплывание события
Либо в go_1 смотреть куда именно был клик (event.target), и если он из "черного списка" - ничего не делать.
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
Для того чтобы понять, почему так происходит можно почитать здесь:
хабр
Чтобы предотвратить вызов событий на родительском элементе - нужно вызвать метод stopPropagation в методе go_2.
Для этого придется немного изменить код:
1.Добавляем передачу параметра event в хэндлер.
<a onclick="go_2(event)">go ></a>
2. Вызываем метод у полученного объекта Event
function go_2(event){
   event.stopPropagation();
    $('div').eq(1).append('go_2<br>');
}
Ответ написан
Ваш ответ на вопрос

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

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