`возвратить false` в обработчике событий, прикрепленном addEventListener или element.on*

Хорошо, давайте сначала разберемся с этим. Да, я хочу скрыть контекстное меню. Нет, я не пытаюсь помешать кому-то удалить контент с моей страницы. Его предполагаемое использование — ввод для браузерной игры, и он будет ограничен определенной областью на веб-странице.

Переходим от идейного к техническому...

var mouse_input = function (evt) {
    // ...
    return false;
}

document.onmousedown = mouse_input; // successful at preventing the menu.
document.addEventListener('mousedown', mouse_input, true); // unsuccessful

Может ли кто-нибудь объяснить мне, почему версия addEventListener не может остановить срабатывание контекстного меню? Единственная разница, которую я смог увидеть в Safari в Веб-инспекторе, заключалась в том, что document.onmousedown имел значение isAttribute, которое было истинным, в то время как версия addEventListener имела то же значение, что и ложное.


javascript addeventlistener dom-events preventdefault
person casr    schedule 11.08.2010    source источник

Ответы (2)


arrow_upward
4
arrow_downward

Так что мои бесплодные поиски вдруг стали плодотворными.

var mouse_input = function (evt) {
    evt.preventDefault();
}

document.addEventListener('contextmenu', mouse_input, false);

Работает для Safari, Firefox, Opera. preventDefault() останавливает выполнение обычных действий. Мне пришлось изменить прослушиваемое событие, чтобы оно соответствовало Safari, и в любом случае это более логично. Дополнительная информация: функции, реализующие EventListener не должен возвращать значения, поэтому return false не имеет никакого эффекта.

person casr    schedule 11.08.2010
comment
Да, это способ сделать это. Однако это не будет работать в IE: в IE вам нужно будет использовать attachEvent и установить window.event.returnValue в false. - person Tim Down; 12.08.2010
comment
Спасибо за информацию. Я ориентируюсь на браузеры с поддержкой <canvas>, и, к счастью, я считаю, что в IE9 есть и это, и addEventListener. - person casr; 12.08.2010
comment
Да, это правда. Справедливо. - person Tim Down; 13.08.2010

arrow_upward
4
arrow_downward

Чтобы объяснить разницу .. element.onmousedown = somefunction; - это абсолютное присвоение; вы заменяете обработчик события в элементе. element.addEventListener(...), как следует из названия, добавляет обработчик в дополнение к любому обработчику (обработчикам), уже прикрепленному к событию.

person Stephen P    schedule 11.08.2010