Прошу помощи по выполнению функции по нажатию 2х клавиш.
Добрый день.
я только начал разбираться с JavaSkript. подскажите пожалуйста, или ткните носом в ссылку где читать - как реализовать задачу: Есть управление стрелками. Есть функция выполняющее определенное действие на клавишах "стрелка вверх" "стрелка вниз" "стрелка вправо" "стрелка влево". Для примерного представления - есть машинка которой управляет плата, плата берет выборку из БД и выполняет функцию которая соответствует считанной строке.. (то есть вперед, вправо ,влево, назад) Возможно ли сделать на javascript так что б при нажатии на UP выполнялась одна функция, потом мы не отпуская UP нажимаем left (для поворота, как в гонках на компьютере то есть получается уже в придачу к UP дожимается Left) - выполнялась другая функция .... left отпустили (то есть едим дальше прямо) но UP при этом не уходил в (onkeyup) и функция продолжала выполнятся для UP ? Буду рад любым советам. Спасибо. |
У меня не много опыта по использованию клавишных событий, но кое-что скажу.
Нужно повесить свои обработчики на события keydown и keyup. Вот статья в учебнике: http://learn.javascript.ru/keyboard-events Вот спецификация W3C для справки (на английском языке): http://www.w3.org/TR/DOM-Level-3-Eve...keyboardevents Вот мой простой пример:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8" />
<title></title>
</head>
<body style="width:500px; height:500px; border:solid 5px">
<div id="square" style="background-color:red; position:relative; width:16px; height:16px"/>
<script type="text/javascript">
var x=0, y=0, keys=[false, false, false, false];
var square=document.getElementById("square");
document.body.addEventListener("keydown", function(event){
var key=event.keyCode;
if (key>=37&&key<=40)
keys[key-37]=true;
});
document.body.addEventListener("keyup", function(event){
var key=event.keyCode;
if (key>=37&&key<=40)
keys[key-37]=false;
});
setInterval(function(){
x+=3*(keys[2]-keys[0]);
y+=3*(keys[3]-keys[1]);
if (x<0)
x=0;
else if (x>484)
x=484;
if (y<0)
y=0;
else if (y>484)
y=484;
square.style.left=x+"px";
square.style.top=y+"px";
}, 100);
</script>
</body>
</html>
хотя я не уверен в его оптимальности. Здесь использовалось свойство keyCode объекта KeyboardEvent, хотя оно является устаревшим, а новое свойство key ещё не поддерживаестя многими браузерами. |
| Часовой пояс GMT +3, время: 06:34. |