Вопрос про dblclick и его стандартный внутренний обработчик
В body есть код:
<ul id="list">
<li>Elem1</li>
<li>Elem2</li>
</ul>
В теге скрипт есть:
let ul = document.querySelector('#list');
let lis = ul.getElementsByTagName("li");
for (let i = 0; i < lis.length; i++) {
let li = lis[i];
li.addEventListener("dblclick", dblclickHandler);
}
function dblclickHandler(event) {
event.preventDefault();
event.stopImmediatePropagation();
}
Как я понимаю, для события dblclick в документе браузер имеет свой внутренний стандартный обработчик на выделение текста при возникновении данного события. В моем коде я хочу отменить это выделение и для этого в своём обработчике события dblclick отменяю действие по умолчанию с помощью event.preventDefault(), прерываю все обработчики события dblclick для данного элемента и запрещаю всплытие с помощью event.stopImmediatePropagation(). Собственно вопрос, почему браузер все равно выделяет текст? Если поставить обработчик с командой event.preventDefault() на событие mousedown, то все будет работать корректно, только понять не могу почему. Может я чего-то не понимаю в технологии работы событий и их обработчиков? Заранее спасибо за ответ. P.S. Тестировал в Chrome |
Цитата:
Завтра они еще что-то придумают и нашим программка пипец. :) |
Хм, ну в учебнике в теме "действия браузера по умолчанию" сказано, что двойной клик на тексте инициирует его выделение и такое действие является действием браузера по умолчанию, затем, сказано, что отменять такие действия по умолчанию можно с помощью метода у объекта события, то есть event.preventDefault(). Получается, я должен создать обработчик для dblclick и там прописать метод event.preventDefault(), чтобы действие по умолчанию (в данном случае выделение текста) отменить. В чем тогда я ошибаюсь и почему тогда данный обработчик, но на событии mousedown работает? Можно подробнее объяснить?) Спасибо.
|
<ul onmousedown="return false" onselectstart="return false">
<li>Elem1</li>
<li>Elem2</li>
</ul>
Источник - Отмена выделения |
Мне не нужна тема про отмену выделения, я её уже читал и про preventDefault() в dblclick ничего не нашел. Все способы в этой теме описаны через другие события, а я хочу понять, почему отмена в обработчике события dblclick не работает)
|
Пока только нашел зацепку на способе 2 из темы отмены выделений. Там говорится, что с помощью метода clearSelection() в обработчике события dblclick мы снимает выделение пост-фактум, то есть выделение сначала появляется и потом сразу исчезает. Получается, что действия браузера на событие dblclick срабатывают раньше обработчиков, которые пишем мы или действие браузера на выделение текста возникает до события dblclick? Но, в то же время, в теме "действия браузера по умолчанию" говориться, что данное действие браузера возникает при возникновении события dblclick... Вообщем, пока у меня каша в голове по этому поводу)
|
BNB,
dblclick - комплексное событие Вот его составляющие: mousedown mouseup click mousedown mouseup click dblclick Судя по всему, браузер делает выделение при двух подряд mousedown, И preventDefault() на dblclick делать уже поздно.
<ul id="list">
<li>Elem1</li>
<li>Elem2</li>
</ul>
<script>
let ul = document.querySelector('#list');
let lis = ul.getElementsByTagName("li");
for (let i = 0; i < lis.length; i++) {
let li = lis[i];
li.addEventListener("dblclick", dblclickHandler);
}
function dblclickHandler(event) {
alert("dblclick");
event.preventDefault();
event.stopImmediatePropagation();
}
</script>
|
Понял, спасибо. Буду надеяться, что так оно и есть)
|
| Часовой пояс GMT +3, время: 07:22. |