JavaScriptは同時に複数のボタンを獲得します.
7193 ワード
ユーザーが同時に2つ以上のキーを押した時、どのようにユーザが「A」と「H」キーsegmentdのClarkを同時に押したかどうかを判断するという考え方(原文リンク):Ctl、altは専門的に判断する属性があります.他のグループなら、keydownの時にPushからarrayの中に保存しています.keyupの時は対応を削除します.毎回keydownの時、arrayをチェックします.最後にコードを実行すると:
<img id="imgPlane" src="" alt=" " />
<script type="text/javascript">
var keyCodeArry = [];
document.onkeydown = function(ev) {
var oEvent = ev || event;
keyCode = oEvent.keyCode;
keyCodeArry = addKeyCodeArry(keyCode, keyCodeArry);
console.log(keyCodeArry);
}
document.onkeyup = function(ev) {
var oEvent = ev || event;
keyCode = oEvent.keyCode;
keyCodeArry = deletKeyCodeArry(keyCode, keyCodeArry);
console.log(keyCodeArry);
}
function addKeyCodeArry(num, arr) {
var check = 0;
for(var i = 0; i < arr.length; i++) {
if(arr[i] == num) {
check = 1;
}
}
if(check == 0) {
arr.push(num);
}
return arr;
}
function deletKeyCodeArry(num, arr) {
for(var i = 0; i < arr.length; i++) {
if(arr[i] == num) {
arr.splice(i, 1);
}
}
return arr;
}
var body = document.getElementsByTagName("body")[0];
var x = 300;
var y = 200;
body.addEventListener("keydown", function(e) {
console.log(e.keyCode);
var imgPlane = document.getElementById("imgPlane");
var speed = 10;
console.log(x + " " + y);
for(var i=0; i < keyCodeArry.length; i++) {
keyCode = keyCodeArry[i];
if(keyCode == 87) {
//w
y -= speed;
}
if(keyCode == 83) {
//s
y += speed;
}
if(keyCode == 65) {
//a
x -= speed;
}
if(keyCode == 68) {
//d
x += speed;
}
}
imgPlane.style.top = y + "px";
imgPlane.style.left = x + "px";
});
function lan_Click() {
var lan = document.getElementById("language");
var lans = ["C", "C++", "Java", "Php", "C#"];
if(lan.children.length == 0) {
for(var i = 0; i < lans.length; i++) {
var li = document.createElement("li");
li.innerHTML = lans[i];
//
li.addEventListener("click", function(e) {
console.log(e.path[0].innerHTML);
});
lan.appendChild(li);
}
} else {
lan.innerHTML = null;
}
}
script>
W/A/S/Dボタンを押して飛行機の移動を制御することで、ユーザーの考えを利用して、斜め方向に移動することができます.