jQuery: отдайте предпочтение внутреннему щелчку

Question

У меня есть большой div с несколькими ссылками внутри, я бы хотел, чтобы большой div тоже был кликабельным И ссылки внутри, я сделал это:

html :

<div class="clickable">
  some text...
  <a href="myurl1">Link 1</a>
  <a href="myurl2">Link 2</a>
  some text...
</div>

jquery :

$('.clickable').click(function() {
   alert('Hello');
});

Если я нажму на ссылку внутри кликабельногоdiv, сначала я получил предупреждение "Hello", а затем загружена новая страница: возможно ли заставить якоря работать без запуска внешнего обработчика щелчка div?

Answer 1

Добавьте этот код:

$('a').click(function(event) {
    event.stopPropagation();
});

Вы можете увидеть это здесь: http://jsfiddle.net/wPymp/

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