function keysPressed(e) {
// хранит запись о каждой нажатой клавише
keys[e.keyCode] = true;
// Ctrl + Shift + 5
if (keys[17] && keys[16] && keys[53]) {
// делает что-то
}
// Ctrl + f
if (keys[17] && keys[70]) {
// делает что-то
// предотвращает стандартное поведение браузера
e. preventDefault();
}
}
Важно учитывать одну деталь: некоторые комбинации клавиш приводят к реагированию браузера. Чтобы избежать выполнения браузером ненужных вам действий, используйте метод preventDefault, как это выделено, при проверке использования Ctrl + F:
function keysPressed(e) {
// хранит запись о каждой нажатой клавише
keys[e.keyCode] = true;
// Ctrl + Shift + 5
if (keys[17] && keys[16] && keys[53]) {
// делает что-то
}
// Ctrl + f
if (keys[17] && keys[70]) {
// делает что-то
// предотвращает стандартное поведение браузера
e. preventDefault();
}
}
Метод preventDefault предотвращает стандартную реакцию браузера на событие. В данном случае он не дает браузеру показать диалоговое окно поиска. Различные комбинации клавиш будут запускать различные реакции браузера, поэтому держите этот метод на вооружении, чтобы исключить их.
В любом случае, при рассмотрении кода в совокупности у вас есть схема для удобной проверки нажатия нескольких клавиш.
КОРОТКО О ГЛАВНОМ
Клавиатура выступает важным элементом взаимодействия пользователей с компьютерами и аналогичными им устройствами. Несмотря на это, не всегда приходится иметь с ней дело напрямую. Ваш браузер, различные относящиеся к тексту элементы управления и аналогичные им компоненты уже справляются с этим по умолчанию. Тем не менее есть определенные приложения, где может потребоваться непосредственно поработать с клавиатурой. Этому и была посвящена текущая глава.
Она началась максимально скучно с объяснения принципа работы событий Keyboard и их аргументов событий. По мере продвижения все становилось интереснее: вы увидели некоторые примеры кода, где были показаны действия с клавиатурой. Если у вас есть какие-либо вопросы по этой или другой теме, не стесняйтесь обращаться с ними на форум https://forum.kirupa.com.
Глава 35. События загрузки страницы и прочее
Важной частью работы с JavaScript является обеспечение выполнения кода в нужное время. И часто все не так просто, чтобы лишь поместить код вниз страницы и ждать, что все начнет работать, как только страница загрузится. Здесь мы еще раз вернемся к некоторым моментам из главы 10. Во многих случаях вам может понадобиться добавить дополнительный код, чтобы гарантировать, что код не будет запущен, пока страница не будет к этому готова. А иногда может даже понадобиться поместить код именно в начало страницы.
Есть множество факторов, влияющих на выбор «подходящего времени» для запуска кода. В этой главе мы рассмотрим эти факторы и сформируем из пройденного материала небольшое полезное руководство.
Поехали!
Что происходит в процессе загрузки страницы
Начнем с самого начала. Вы щелкаете по ссылке либо нажимаете Enter после набора URL, и если сошлись звезды, загружается страница. Все кажется очень простым и занимает мало времени:
За этот короткий отрезок времени происходит множество связанных с ним интересных процессов, о которых следует знать подробнее. Одним из примеров таких процессов является выполнение заданного для страницы кода. Точный момент выполнения этого кода зависит от сочетания следующих компонентов, которые оживают в определенный момент загрузки страницы:
• событие DOMContentLoaded;
• событие load;
• атрибут async элементов сценария;
• атрибут defer элементов сценария;
• место расположения сценария в DOM.
Не переживайте, если перечисленное вам не знакомо. Очень скоро вы узнаете о назначении всех этих штук. Но сначала рассмотрим три стадии загрузки страницы.
Стадия первая
Первая стадия охватывает момент, когда браузер вот-вот начнет загрузку страницы.
