Клавиатура и JavaScript

AG
На сайте с 13.10.2014
Offline
44
487

Доброго времени суток.

Помогите пожалуйста разобраться с вопросом.

У кнопки есть класс x. Кликая по данной кнопке, класс y удаляется.

$(document).ready (function () {
$(".x").bind("click", q);
function q() {
$('html').removeClass('y');
}
});

Мне же надо что бы удаление класса y происходило после нажатия на клавиатуре клавиши Esc. Известно что скан-код у данной клавиши это 27. Не пойму как мне теперь все это соединить во едино.

ДП
На сайте с 23.11.2009
Offline
203
#1

Вешаете обработчик нажатия клавиатуры на весь документ и там определяете по e.keyCode какая клавиша нажата.

https://learn.javascript.ru/keyboard-events - тут на русском есть про нюансы.

AG
На сайте с 13.10.2014
Offline
44
#2

Дикий пионер, ну у меня получается вот такая конструкция. Оно работает, но с точки зрения оптимизации кода это правильно вообще? :)

$(document).ready (function () {

$(".x").bind("click", q);
function q() {
$('html').removeClass('y');
}
});

$(document).ready(function(){
$(window).keyup(function (event) {
if ( event.keyCode == 27 ) $('.x').click();
});
});
ДП
На сайте с 23.11.2009
Offline
203
#3

Тут такой момент - если у вас кнопка одна - то лучше по айдишнику к ней прицепиться. Если несколько - то как вы будете выбрать нужную, с которой надо снять класс по esc - или со всех?

Ну и все внутри одного document ready как минимум написать.

У вас какая-то практическая задачка или просто jQuery изучаете?

AG
На сайте с 13.10.2014
Offline
44
#4

Насчет подключения через ID я в курсе, спасибо, но в конкретно в данной задаче это не имеет значения. Задача практическая, ну и попутно изучаю язык. Спасибо за помощь :)

tommy-gung
На сайте с 22.11.2006
Offline
300
#5

функция же определена


if ( event.keyCode == 27 ) {
q();
}
Здесь не могла быть ваша реклама
doctorpc
На сайте с 12.07.2009
Offline
112
#6


$(document).ready (function () {
$(window).keydown(function (event) {
if ( event.keyCode == 27 ) {
$('html').removeClass('y');
}
});
});
AG
На сайте с 13.10.2014
Offline
44
#7

Спасибо всем за помощь. Все понятно.

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий