Web-mastering: портал вебмастеров (web-мастеров) о web-дизайне, web-программировании, раскрутке; статьи по веб-дизайну, веб-программированию для вебмастеров
Одним из последних новшеств в
браузерах последнего поколения является
возможность из скриптов получать коды
клавиш, нажатых пользователем. Но, как
всегда, производители не захотели
договариваться о способах реализации этой
возможности.
Рассмотрим как это работает в
Internet Explorer. Для этого достаточно назначить
обработчик события onkeydown.
Делается это так:
document.onkeydown = keyDown;
keyDown - процедура-обработчик
события. Необходимо отметить, что
наименование события необходимо
указывать в нижнем регистре, а после имени
процедуры-обработчика скобки не ставятся
Далее при нажатии на клавишу
будет происходить вызов процедуры keyDown.
Код нажатой клавиши можно получить из window.event.keyCode.
Таким образом, процедура keyDown
для Internet Explorer может выглядеть так:
function keyDown() {
var key = window.event.keyCode;
...
}
document.onkeydown = keyDown;
Пример только для Intenet
Explorer: key_ie.html
Теперь рассмотрим ситуацию для
Netscape Navigator. Здесь процедура перехвата
выглядит несколько иначе:
Вторая строчка заставляет
Навигатор отслеживать события нажатия на
клавиши. Есть и еще одно отличие. Параметры
события в Навигаторе передаются на в
переменную window.event, а в
качестве параметра в процедуру-обработчик,
а сам код клавиши будет содержаться в
свойстве which этого параметра.
Таким образом и описание процедуры keyDown
будет выглядеть иначе:
function keyDown(ev) {
var key = ev.which;
...
}
Пример только для Netscape
Navigator: key_nn.html
Теперь соберем все вместе. Мы
будем использовать библиотеку
определения браузера, которую я уже описывал.
Код будет выглядеть так:
<SCRIPT TYPE="text/javascript" LANGUAGE="JavaScript">
function keyDown ( ev ) {
(NN)? var key = ev.which : var key = window.event.keyCode;
...
}
document.onkeydown = keyDown;
if (NN) { document.captureEvents(Event.KEYDOWN) }
</SCRIPT>
Пример для обоих браузеров:
key.html
Но, к сожалению, на этом наши
мучения не заканчиваются. Разработчики
предусмотрели разные значения для кодов
клавиш. Если мы используем преобразование
кода клавиши в символ с помощью метода String.fromCharCode(key),
то заметим, IE что реализует одинаковые
коды как для верхнего регистра, так и для
нижнего, а NN разные. Кроме того, NN
устанавливает код в 0 для любых клавиш,
кроме алфавитно-цифровых.
Пример для обоих браузеров с
преобразованием: key_ex.html