12.08.2018, 18:40
|
Интересующийся
|
|
Регистрация: 09.02.2018
Сообщений: 27
|
|
Проблема с событием keyup
Пользуюсь Google Chrome.
К пустой странице подключил скрипт, думаю объяснять тут нечего)
document.onkeydown = function() {
alert("keydown");
}
document.onkeyup = function() {
alert("keyup");
}
Рассчитывал, что при нажатии любой клавиши будут выводиться оба обработчика событий, т.к. сработает и событие keydown и событие keyup, но почему-то срабатывает только обработчик события keydown.
Затем решил поставить обработчики событий на window, но результат такой же.
Также, если просто 100 раз нажимать на какую-либо кнопку и быстро закрывать модальные окна alert-а, то иногда прослеживается событие keyup, если попробовать нажать Ctrl+ R (перезагрузка страницы), то тоже сработает keyup.
Если заменить alert, например, на console.log, то всё работает как надо.
Получается, что встроенные модальные окна при работе с событиями клавиш лучше не использовать, а делать свои кастомные модальные окна, т.к. при появлении встроенного модального окна события связанные с клавишами не возникают?
Если да, то следует ли из этого, что любые существующие события на момент работы встроенного модального окна не будут возникать?
|
|
12.08.2018, 18:52
|
|
Профессор
|
|
Регистрация: 20.12.2009
Сообщений: 1,714
|
|
<style>dialog { box-shadow: 0 0 0 100vmax rgba(0,0,0,.1); }</style>
<script>
document.onkeydown = document.onkeyup = function(event) {
if(event.keyCode === 13) return;
var dialog = document.createElement("dialog");
dialog.innerHTML = "<div>" + event.type + " " + event.key + "</div>";
var closeButton = document.createElement("button");
closeButton.onclick = function() { dialog.close(); dialog.remove(); };
closeButton.textContent = "Закрыть";
dialog.appendChild(closeButton);
document.body.appendChild(dialog);
dialog.show();
}
</script>
Вообще-то происходят оба события, просто когда открывается блокирующий alert, то второе событие теряется
Последний раз редактировалось Malleys, 12.08.2018 в 19:08.
|
|
12.08.2018, 19:21
|
Интересующийся
|
|
Регистрация: 09.02.2018
Сообщений: 27
|
|
Разве событие mouseup происходит? Не очень понимаю как оно "теряется". Оно срабатывает на элементе выше window и из-за этого ни document, ни window не узнают про него? Просто раз оно теряется, значит оно все-таки возникло. Или на DOM элементах стоит скрытая проверка, условно говоря, if (alertActivation) return? Мне пока кажется, что на время работы модального окна события просто не возникают. Если нет, то можно поподробнее, пожалуйста, спасибо.
Кстати в учебнике Кантора в теме про события keyup, keydown, keypress в одной задаче он написал, что при alert событие keyup не возникает. Так что больше пока склоняюсь к этой точке зрения.
Последний раз редактировалось BNB, 12.08.2018 в 19:26.
|
|
12.08.2018, 19:30
|
|
Профессор
|
|
Регистрация: 20.12.2009
Сообщений: 1,714
|
|
<script>
document.onkeydown = function() {
alert("keydown");
}
document.onkeyup = function() {
alert("keyup");
}
</script>
Вы нажимаете кнопку X происходит событие keydown открывается alert("keydown");
Вы продолжаете удерживать ту же клавишу, но события keydown больше не возникают, поскольку ещё открыт alert, который всё блокирует.
Вы отпускаете клавишу, но событие keyup не возникают, поскольку ещё открыт alert, который всё блокирует. (но если вы всё-таки ухитрились бы быстро закрыть alert, то событие keyup возникло бы? Например, если нажимать последовательно Esc⎋ или Enter⏎, то закрывается alert и событие ловится)
Пока открыт alert, который всё блокирует, никакое событие не возникнет, сколько бы вы ни нажимали на клавиатуру.
"теряется" в том плане, что вообще не попадает в событийную модель JavaScript
Последний раз редактировалось Malleys, 12.08.2018 в 19:41.
|
|
12.08.2018, 19:39
|
Интересующийся
|
|
Регистрация: 09.02.2018
Сообщений: 27
|
|
Ну Вы сначала написали:"Пока открыт alert, который всё блокирует, никакое событие не возникнет...", а потом:" "теряется" в том плане, что вообще не попадает в событийную модель JavaScript", то есть оно возникает, но не попадает в событийную модель) Тут как будто какое-то противоречие возникает, но может это я просто не так понимаю Вас. В любом случае, основная моя мысль подтвердилась, спасибо.
Последний раз редактировалось BNB, 12.08.2018 в 19:43.
|
|
12.08.2018, 20:03
|
|
Профессор
|
|
Регистрация: 20.12.2009
Сообщений: 1,714
|
|
Тут на самом деле нет противоречия, вы нажимаете клавишу на клавиатуре, микропроцессор клавиатуры выясняет на какую клавишу нажали, и посылает информацию в компьютер. (Событие свершилось!) Операционная система решает, что делать с этой информацией, например, поскольку на данный момент активно окно браузера, то эта информация попадает в браузер. (Событие свершилось!) В браузере эта информация попадает на интерфейс модального окна от браузера, а не на вашу страницу.
"Пока открыт alert, который всё блокирует, никакое событие не возникнет..." С точки зрения программы на JS, как вы уже догадались (или нет?), действительно не возникло никаких событии!
Последний раз редактировалось Malleys, 12.08.2018 в 20:06.
|
|
12.08.2018, 20:07
|
Интересующийся
|
|
Регистрация: 09.02.2018
Сообщений: 27
|
|
Хорошо, я понял, спасибо.
|
|
|
|