Що таке гарячі клавіші?
Починаємо з першого кроку і підключаємо наш скрипт гарячих клавіш dershortcut.js. а також не забуваємо про стилі demo.css.
Тепер нам потрібно створити форму, в якій буде для прикладу, три поля - ім'я, прізвище та повідомлення. Обробника для даної форми я не робив, так як ми поки що, тільки знайомимося із застосуванням гарячих клавіш.
Далі створюємо змінну text і записуємо в неї отримання від поля textarea, будь-якої передачі даних при введенні і відправці тексту. В поле ідентифікатора text. також не забуваємо прибрати зайві переноси рядків за допомогою функції replace.
Далі не погано було б зробити наше поле, більш схожим як в контакті, тобто при натисканні на клавішу enter. каретка не повинна зсуватися, так як перенесення не повинно бути на новий рядок. Для цього нам буде потрібно наступна конструкція. Причому зауважте, що є й інші гарячі клавіші крім enter. тому скрипт повинен містити і їх доступність теж.
Коли перевірку ми зробили і поставили змінні, нам залишилося зробити два останніх перевірки, перша з яких клавіша надсилання повідомлення повинна бути enter, а друга, перевіряє довжину тексту, яка повинна бути біль нуля.
Тепер можемо сміливо переходити до інших гарячих клавішах, таким як alt. shift. ctrl і capslock. Для початку нам потрібно умова, яке буде стверджувати значення натиснутоюклавіші capslock.
Тепер перейдемо до функції keyUp зі значенням event. Вона потрібна нам виключно для відкату дій або скидання при натисканні клавіш.
Наприклад, тепер нам потрібно скасувати натиснуту клавішу capslock для цього пропишемо.
І на останок, не погано було б зробити перемикання між полями - ім'я, прізвище, повідомлення через клавішу Enter. Робиться це все через функцію KeyPress з двома значеннями event і fields. Перше спілкування значення KeyCode. а друге використовується для конкретного поля. Доречно вжити тут подія focus. адже за допомогою нього і скрипт перемикається між елементами полів.
Не забуваємо особливу увагу приділяти над роботою скрипта в різних браузерах, адже для цього потрібно все детально налагоджувати. Вивчаючи і практикуючись на цих прикладах, Ви зможете повноцінно зрозуміти, як працюють ці події і вже тоді ми перейдемо до теми як в контакті, над реалізацією переходу між гарячими клавішами. Весь код я привів нижче, щоб було зручніше Вам ознайомитися.
А на цьому все, дякую всім за увагу, прощаюся ненадовго. Всім удачі!