Почему не удается событие mouseup предотвратить событие click

jsfiddle

<div class='wrapper'>
    <button class='child'>Click me</button>
</div>

function h(e) {
    e.preventDefault();
    e.stopPropagation();
    e.stopImmediatePropagation();
    alert(e.type);
    return false;
}

document.querySelector('.wrapper').addEventListener('mouseup', h, false);
document.querySelector('.child').addEventListener('click', h, false);

Я ожидаю, что это предотвратит запуск события 'click', но это не так. Однако изменение mouseup до mousedown фактически предотвращает событие click.

Я также попытался установить аргумент useCapture в значение true, и это также не приведет к желаемому поведению с mouseup. Я протестировал это в Chrome и Firefox. Прежде чем я напишу об ошибках, я решил, что спрошу здесь.

Является ли это ошибкой в текущих браузерах или это документированное поведение?

Я рассмотрел стандарт W3C (уровень DOM 2), и я не смог найти ничего, что могло бы объяснить это поведение, но я мог что-то пропустить.

В моем конкретном случае я пытаюсь отделить две части кода, которые прослушивают события на одном и том же элементе, и я решил использовать события захвата со стороны, которая имеет приоритет, будет самым изящным способом решить эту проблему, но то я столкнулся с этой проблемой. FWIW, я должен поддерживать официально поддерживаемые версии FF и Chrome (включая ESR для FF).

Ответ 1

Ознакомьтесь с этой статьей quirksmode

Событие click:

Запускается, когда в одном и том же элементе происходит событие mousedown и mouseup.

Итак, когда вызывается щелчок мыши, запускаются события mouseup и click, click не дожидается завершения обратного вызова mouseup. Почти всегда mouseup и click могут использоваться синонимично.

Чтобы отменить click, как вы продемонстрировали, вы можете вернуть false в обратном вызове события mousedown, который предотвращает завершение события click.