JavaScript multiple keydown
0
First, I would like to thank all for your help and replies.
I'm working on a project that required users to press a key and hold it, it will trigger an action.
When the user presses another key ( still holing the first key), it will trigger another action.
However, I'm stuck getting JavaScript to recognize two keys being pressed at the same time.
var down = false;
var keys;
document.addEventListener("keydown", function (e) {
if (down) {return;}
down = true;
keys = (keys || );
keys[e.keyCode]=true;
if (keys[87]){
console.log("1");
}
else if (keys[83]){
console.log("2");
}
else if (keys[83] && keys[87]){
console.log("sucessfull");
}
} , false);
document.addEventListener("keyup", function (e) {
down = false;
keys[e.keyCode]=false;
stop();
}, false);<button id="up" onmousedown="Drive(1)" onmouseup="Drive(2)">UP </button>javascript html onkeydown
edited Nov 21 '18 at 5:27
Foo
1
asked Nov 21 '18 at 3:56
Vu Vo
265
add a comment |
0
First, I would like to thank all for your help and replies.
I'm working on a project that required users to press a key and hold it, it will trigger an action.
When the user presses another key ( still holing the first key), it will trigger another action.
However, I'm stuck getting JavaScript to recognize two keys being pressed at the same time.
var down = false;
var keys;
document.addEventListener("keydown", function (e) {
if (down) {return;}
down = true;
keys = (keys || );
keys[e.keyCode]=true;
if (keys[87]){
console.log("1");
}
else if (keys[83]){
console.log("2");
}
else if (keys[83] && keys[87]){
console.log("sucessfull");
}
} , false);
document.addEventListener("keyup", function (e) {
down = false;
keys[e.keyCode]=false;
stop();
}, false);<button id="up" onmousedown="Drive(1)" onmouseup="Drive(2)">UP </button>javascript html onkeydown
edited Nov 21 '18 at 5:27
Foo
1
asked Nov 21 '18 at 3:56
Vu Vo
265
When your second keydown event is received, the down boolean will be true and the function will immediately return. It looks like if you remove the down variable (and associated checks/returns) your code might achieve what you want it to already.
– dave
Nov 21 '18 at 5:15
add a comment |
0
0
0
First, I would like to thank all for your help and replies.
I'm working on a project that required users to press a key and hold it, it will trigger an action.
When the user presses another key ( still holing the first key), it will trigger another action.
However, I'm stuck getting JavaScript to recognize two keys being pressed at the same time.
var down = false;
var keys;
document.addEventListener("keydown", function (e) {
if (down) {return;}
down = true;
keys = (keys || );
keys[e.keyCode]=true;
if (keys[87]){
console.log("1");
}
else if (keys[83]){
console.log("2");
}
else if (keys[83] && keys[87]){
console.log("sucessfull");
}
} , false);
document.addEventListener("keyup", function (e) {
down = false;
keys[e.keyCode]=false;
stop();
}, false);<button id="up" onmousedown="Drive(1)" onmouseup="Drive(2)">UP </button>javascript html onkeydown
edited Nov 21 '18 at 5:27
Foo
1
asked Nov 21 '18 at 3:56
Vu Vo
265
First, I would like to thank all for your help and replies.
I'm working on a project that required users to press a key and hold it, it will trigger an action.
When the user presses another key ( still holing the first key), it will trigger another action.
However, I'm stuck getting JavaScript to recognize two keys being pressed at the same time.
var down = false;
var keys;
document.addEventListener("keydown", function (e) {
if (down) {return;}
down = true;
keys = (keys || );
keys[e.keyCode]=true;
if (keys[87]){
console.log("1");
}
else if (keys[83]){
console.log("2");
}
else if (keys[83] && keys[87]){
console.log("sucessfull");
}
} , false);
document.addEventListener("keyup", function (e) {
down = false;
keys[e.keyCode]=false;
stop();
}, false);<button id="up" onmousedown="Drive(1)" onmouseup="Drive(2)">UP </button>var down = false;
var keys;
document.addEventListener("keydown", function (e) {
if (down) {return;}
down = true;
keys = (keys || );
keys[e.keyCode]=true;
if (keys[87]){
console.log("1");
}
else if (keys[83]){
console.log("2");
}
else if (keys[83] && keys[87]){
console.log("sucessfull");
}
} , false);
document.addEventListener("keyup", function (e) {
down = false;
keys[e.keyCode]=false;
stop();
}, false);<button id="up" onmousedown="Drive(1)" onmouseup="Drive(2)">UP </button>var down = false;
var keys;
document.addEventListener("keydown", function (e) {
if (down) {return;}
down = true;
keys = (keys || );
keys[e.keyCode]=true;
if (keys[87]){
console.log("1");
}
else if (keys[83]){
console.log("2");
}
else if (keys[83] && keys[87]){
console.log("sucessfull");
}
} , false);
document.addEventListener("keyup", function (e) {
down = false;
keys[e.keyCode]=false;
stop();
}, false);<button id="up" onmousedown="Drive(1)" onmouseup="Drive(2)">UP </button>javascript html onkeydown
javascript html onkeydown
edited Nov 21 '18 at 5:27
Foo
1
asked Nov 21 '18 at 3:56
Vu Vo
265
edited Nov 21 '18 at 5:27
Foo
1
asked Nov 21 '18 at 3:56
Vu Vo
265
edited Nov 21 '18 at 5:27
Foo
1
edited Nov 21 '18 at 5:27
Foo
1
edited Nov 21 '18 at 5:27
Foo
1
1
asked Nov 21 '18 at 3:56
Vu Vo
265
asked Nov 21 '18 at 3:56
Vu Vo
265
asked Nov 21 '18 at 3:56
Vu Vo
265
265
When your second keydown event is received, the down boolean will be true and the function will immediately return. It looks like if you remove the down variable (and associated checks/returns) your code might achieve what you want it to already.
– dave
Nov 21 '18 at 5:15
add a comment |
When your second keydown event is received, the down boolean will be true and the function will immediately return. It looks like if you remove the down variable (and associated checks/returns) your code might achieve what you want it to already.
– dave
Nov 21 '18 at 5:15
When your second keydown event is received, the down boolean will be true and the function will immediately return. It looks like if you remove the down variable (and associated checks/returns) your code might achieve what you want it to already.
– dave
Nov 21 '18 at 5:15
When your second keydown event is received, the down boolean will be true and the function will immediately return. It looks like if you remove the down variable (and associated checks/returns) your code might achieve what you want it to already.
– dave
Nov 21 '18 at 5:15
add a comment |
1 Answer
1
active
oldest
votes
1
- Removed the 'down' variable checks
- Removed the mouse button element thing - didn't seem relevant to your problem?
- Removed the extra HTML body
Got rid of the else branching as it would be satisfied (by 87 or 83) before ever getting to the && condition
var keys;
document.addEventListener("keydown", function (e) {
keys = (keys || );
keys[e.keyCode]=true;
if (keys[87]){
console.log("1");
}
if (keys[83]){
console.log("2");
}
if (keys[83] && keys[87]){
console.log("sucessfull");
}
} , false);
document.addEventListener("keyup", function (e) {
keys[e.keyCode]=false;
stop();
}, false);
answered Nov 21 '18 at 5:23
dave
5341515
The reason why I add boolean there because I don't want HTML to repeat action when holding a key.
– Vu Vo
Nov 21 '18 at 9:37
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53405049%2fjavascript-multiple-keydown%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
1
- Removed the 'down' variable checks
- Removed the mouse button element thing - didn't seem relevant to your problem?
- Removed the extra HTML body
Got rid of the else branching as it would be satisfied (by 87 or 83) before ever getting to the && condition
var keys;
document.addEventListener("keydown", function (e) {
keys = (keys || );
keys[e.keyCode]=true;
if (keys[87]){
console.log("1");
}
if (keys[83]){
console.log("2");
}
if (keys[83] && keys[87]){
console.log("sucessfull");
}
} , false);
document.addEventListener("keyup", function (e) {
keys[e.keyCode]=false;
stop();
}, false);
answered Nov 21 '18 at 5:23
dave
5341515
The reason why I add boolean there because I don't want HTML to repeat action when holding a key.
– Vu Vo
Nov 21 '18 at 9:37
add a comment |
1
- Removed the 'down' variable checks
- Removed the mouse button element thing - didn't seem relevant to your problem?
- Removed the extra HTML body
Got rid of the else branching as it would be satisfied (by 87 or 83) before ever getting to the && condition
var keys;
document.addEventListener("keydown", function (e) {
keys = (keys || );
keys[e.keyCode]=true;
if (keys[87]){
console.log("1");
}
if (keys[83]){
console.log("2");
}
if (keys[83] && keys[87]){
console.log("sucessfull");
}
} , false);
document.addEventListener("keyup", function (e) {
keys[e.keyCode]=false;
stop();
}, false);
answered Nov 21 '18 at 5:23
dave
5341515
The reason why I add boolean there because I don't want HTML to repeat action when holding a key.
– Vu Vo
Nov 21 '18 at 9:37
add a comment |
1
1
1
- Removed the 'down' variable checks
- Removed the mouse button element thing - didn't seem relevant to your problem?
- Removed the extra HTML body
Got rid of the else branching as it would be satisfied (by 87 or 83) before ever getting to the && condition
var keys;
document.addEventListener("keydown", function (e) {
keys = (keys || );
keys[e.keyCode]=true;
if (keys[87]){
console.log("1");
}
if (keys[83]){
console.log("2");
}
if (keys[83] && keys[87]){
console.log("sucessfull");
}
} , false);
document.addEventListener("keyup", function (e) {
keys[e.keyCode]=false;
stop();
}, false);
answered Nov 21 '18 at 5:23
dave
5341515
- Removed the 'down' variable checks
- Removed the mouse button element thing - didn't seem relevant to your problem?
- Removed the extra HTML body
Got rid of the else branching as it would be satisfied (by 87 or 83) before ever getting to the && condition
var keys;
document.addEventListener("keydown", function (e) {
keys = (keys || );
keys[e.keyCode]=true;
if (keys[87]){
console.log("1");
}
if (keys[83]){
console.log("2");
}
if (keys[83] && keys[87]){
console.log("sucessfull");
}
} , false);
document.addEventListener("keyup", function (e) {
keys[e.keyCode]=false;
stop();
}, false);
answered Nov 21 '18 at 5:23
dave
5341515
answered Nov 21 '18 at 5:23
dave
5341515
answered Nov 21 '18 at 5:23
dave
5341515
answered Nov 21 '18 at 5:23
dave
5341515
5341515
The reason why I add boolean there because I don't want HTML to repeat action when holding a key.
– Vu Vo
Nov 21 '18 at 9:37
add a comment |
The reason why I add boolean there because I don't want HTML to repeat action when holding a key.
– Vu Vo
Nov 21 '18 at 9:37
The reason why I add boolean there because I don't want HTML to repeat action when holding a key.
– Vu Vo
Nov 21 '18 at 9:37
The reason why I add boolean there because I don't want HTML to repeat action when holding a key.
– Vu Vo
Nov 21 '18 at 9:37
add a comment |
draft saved
draft discarded
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Some of your past answers have not been well-received, and you're in danger of being blocked from answering.
Please pay close attention to the following guidance:
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53405049%2fjavascript-multiple-keydown%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
When your second keydown event is received, the down boolean will be true and the function will immediately return. It looks like if you remove the down variable (and associated checks/returns) your code might achieve what you want it to already.
– dave
Nov 21 '18 at 5:15