Javascript: остановить onClick по умолчанию

-4

У меня такое чувство, что я упускаю что-то очевидное, но просто вижу это.

Установлен триггер события click:

anchor.addEventListener("click", myClickEvent );

function myClickEvent() {
this.preventDefault(); // fails
return false;
}

Однако метод onClick по умолчанию все еще происходит.

Могу ли я отменить пропозицию по умолчанию в то же время, что и addEventListener, или есть какой-то другой способ сделать это. Я не могу использовать.preventDefault() из myClickEvent, потому что событие недоступно в этой точке.

Измените следующие комментарии для ясности: Значение по умолчанию onClick тега происходит, хотя myClickEvent возвращает false.

спросил(а) 2021-01-19T14:44:34+03:00 2 месяца, 3 недели назад
1
Решение
75

Возврат false из обработчика, который был зарегистрирован с помощью addEventListener, ничего не делает. См. qaru.site/questions/288/... и https://developer.mozilla.org/en-US/docs/Web/API/Event/preventDefault.

Рекомендуемым способом является вызов event.preventDefault()

function myClickEvent(e) {
e.preventDefault()
}

Обработчики из атрибутов HTML по-прежнему работают, но вы не должны использовать его, так как не так ясно, что return false по сравнению с event.preventDefault() (не разрешать ссылку) и event.stopPropagation() (не позволяйте событие пузырится)

ответил(а) 2021-01-19T14:44:34+03:00 2 месяца, 3 недели назад
76

element.addEventListener("click", myClickEvent );

function myClickEvent(event) {
event.preventDefault();
return false;
}

ответил(а) 2021-01-19T14:44:34+03:00 2 месяца, 3 недели назад
44

Почти там благодаря кодексу Teemu, но не совсем.

Существует разница в зависимости от того, как вызывается функция. По-видимому, есть и скрытый переданный параметр, определяющий значение "this", а при вызове без параметров - автоматический объект события, отправленный как первый видимый параметр:

Назовите его без параметров:

anchor.addEventListener("click", myClickEvent );

function myClickEvent(param1, param2) {
// this = events parent element (<a>)
// this.href = <a href=...>
// param1 = event object
// param2 = undefined
oEvent = param1;
oEvent.preventDefault();
}

но затем назовите его параметрами:

anchor.addEventListener("click", function (oEvent) { myClickEvent(oEvent, myParameter); });

function myClickEvent(param1, param2) {
// this = [object Window]
// this.href = undefined
// param1 = event object
// param2 = myParameter
oEvent = param1;
oEvent.preventDefault();
}

Обратите внимание, что при отправке параметров вручную значение "this" изменяется из родительского элемента событий в "[окно объекта]", в результате чего this.href ошибается.

Однако функция preventDefault теперь работает надежно.

ответил(а) 2021-01-19T14:44:34+03:00 2 месяца, 3 недели назад
44

В глобальной области не существует такой функции, которая называется preventDefault - вам нужно использовать событие, которое было передано в ваш обратный вызов.

Также убедитесь, что вы прикрепляете событие к чему-то, на что можно нажать (форма, якорь, кнопка и т.д.), Которые потенциально могут предотвратить событие.

Если вы присоедините событие к дочернему/родительскому элементу, все будет работать так, как вы ожидали.

ответил(а) 2021-01-19T14:44:34+03:00 2 месяца, 3 недели назад
Ваш ответ
Введите минимум 50 символов
Чтобы , пожалуйста,
Выберите тему жалобы:

Другая проблема