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

Question

[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>

Answer 1

[Stalker_RED]

Два варианта:
Либо в go_2 использовать stopPropagation() чтобы остановить всплывание события
Либо в go_1 смотреть куда именно был клик (event.target), и если он из "черного списка" - ничего не делать.

Comments

[Spiriiit]

Спасибо.

Answer 2

[Николай]

Для того чтобы понять, почему так происходит можно почитать здесь:
хабр
Чтобы предотвратить вызов событий на родительском элементе - нужно вызвать метод 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>');
}

Comments

[Spiriiit]

И вам спасибо за статью