Когда использовать PreventDefault() vs Return false?

Во-первых, в модели событий JavaScript вы придете через концепцию, называемую пузырьком событий (что делает событие распространяться от ребенка элемент к родительскому элементу). Чтобы избежать такого рода барботажный эффект, многие разработчики используйте метод события stopPropagation( ). Кроме того, разработчики начали использовать return false, чтобы остановить такое распространение. Теперь есть еще одна терминология, называемая preventDefault( ). Как видно из названия, это метод предотвращает любое поведение по умолчанию элемент для запуска. Наилучшим вариантом использования является предотвращение привязать тег, чтобы открыть ссылку.

Вы можете встретить сценарий, в котором вы хотел бы предотвратить привязку метки открытие ссылки (поведение по умолчанию), а также остановка событие от перехода к родительскому. В такой ситуации вместо написания двух строк кода, вы можете сделать это в одной строке i.e; return false

Ответы

Ответ 1

вернуть false;

return false; делает 3 отдельные вещи, когда вы это называете:

event.preventDefault() - останавливает поведение браузеров по умолчанию.
event.stopPropagation() - Это предотвращает распространение события (или "пузырь" ) DOM.
Остановка выполнения обратного вызова и возврат немедленно при вызове.

Обратите внимание, что это поведение отличается от обычных (не jQuery) обработчиков событий, в которых, в частности, return false не останавливает событие от пузырьков.

preventDefault();

preventDefault(); делает одно: он останавливает поведение браузеров по умолчанию.

Когда их использовать?

Мы знаем, что они делают, но когда их использовать? Просто это зависит от того, чего вы хотите достичь. Используйте preventDefault();, если вы хотите "просто" предотвратить поведение браузера по умолчанию. Использовать return false; когда вы хотите предотвратить поведение браузера по умолчанию и предотвратить распространение события DOM. В большинстве ситуаций, когда вы будете использовать return false; вам действительно нужно preventDefault().

<сильные > Примеры:

Давайте попробуем разобраться с примерами:

Мы увидим чистый пример JAVASCRIPT

Пример 1:

<div onclick='executeParent()'>
  <a href='http://stackoverflow.com' onclick='executeChild()'>Click here to visit stackoverflow.com</a>
</div>
<script>
  function executeChild() {
    alert('Link Clicked');
  }

  function executeParent() {
    alert('div Clicked');
  }
</script>