Почнемо з того, що велика частина розробників взагалі не заморочується такими питаннями і просто повертає false в колбеке, коли потрібно зупинити подальше виконання, тобто .:
Начебто все добре, але чи знаєте ви що відбувається за ширмою, коли ви натискаєте на посилання? Перше - так, ви домоглися своєї мети, ви запобігли відвідування посилання (тут спрацював event.preventDefault () метод), але ви також зупинили поширення (propagation) події (по суті виконали event.stopPropagation ()) і тепер callback -фунція повертає false .
Отже, як ви вже зрозуміли такий спосіб збільшує коефіцієнт кривизни коду.
Якщо ви всього лише хочете запобігти дію браузера за замовчуванням, то вам слід використовувати preventDefault метод:
Йдемо далі. Що таке stopPropagation. Простіше буде розібратися на прикладі. Припустимо що у нас є така структура HTML:
І два обробника:
Чи можемо переконається в тому, що при кліці на посилання колір блоку не змінюється на жовтий і сам обробник не викликається. А все завдяки методу stopPropagation (). який останавліваетвсплитіе (bubbling) події "клік" до батьківських елементів.
Ось приклад повністю. Якщо ми приберемо звідти stopPropagation (). то зможемо переконається що все працює.
А що таке stopImmediatePropagation (). і чим відрізняється від stopPropagation ()? Відразу приклад у відповідь. Як бачимо stopImmediatePropagation () зупиняє не тільки спливання події по батьківським елементів, але також зупиняє роботу всіх наступних обробників конкретного події на даному елементі.