Welcome!

By registering with us, you'll be able to discuss, share and private message with other members of our community.

SignUp Now!
  • Guest, before posting your code please take these rules into consideration:
    • It is required to use our BBCode feature to display your code. While within the editor click < / > or >_ and place your code within the BB Code prompt. This helps others with finding a solution by making it easier to read and easier to copy.
    • You can also use markdown to share your code. When using markdown your code will be automatically converted to BBCode. For help with markdown check out the markdown guide.
    • Don't share a wall of code. All we want is the problem area, the code related to your issue.


    To learn more about how to use our BBCode feature, please click here.

    Thank you, Code Forum.

JavaScript Need help with basic jump game. Can't take multiple key presses.

I

isaac19030

Coder
After posting last week, I decided to isolate the code to very basic logic and I still have the same problem.

With the attached code I cannot get the "D", "W" and "Spacebar" keys to fire simultaneously. It works with "A"
Code: 
<!DOCTYPE html>
<html>
<body>
    <script>
        let test = function(input){console.log(input)};
       
        let keyPress = {};
        let testKeys = function(){
            //move left
            if (keyPress.a && !keyPress.d){
                //test('A, Left');
            };
            //move right
            if (keyPress.d && !keyPress.a){
                //test('D, Right');      
            };
            //run
            if(keyPress[' ']){
                //test('Spacebar, Run');
            };
            //jump
            if(keyPress.w){
                //test('W, Jump');
            };
            if(keyPress.a && keyPress.w && keyPress[' ']){
                test('jump running to the left');
            };
            //I Cannot get this to display
            if(keyPress.d && keyPress.w && keyPress[' ']){
                test('jump running to the right');
            };
            requestAnimationFrame(testKeys);
        };
        testKeys();

        window.addEventListener('keydown', keyDownListener);
            function keyDownListener(event) {
            keyPress[event.key] = true;
        };
        window.addEventListener('keyup', keyUpListener);
            function keyUpListener(event) {
            keyPress[event.key] = false;
        };
       
    </script>
</body>
</html>
, "W" and "Spacebar"...

How can this be? There must be something wrong with my keyboard perhaps.

Any Ideas would be greatly appreciated. Thanks!
 
Last edited:
Sort by date Sort by votes
Hello,

I’m not able to test at the moment due to being on mobile. But from what I have read - for letters like a or d, the value of event.key is case-sensitive (e.g., 'a' for lowercase, 'A' for uppercase). If your keyboard is set to a different layout or Caps Lock is on, it might not behave as expected. Try this below and see how it behaves. Let me know if you have issues still or if the problem is resolved once testing the code below.

JavaScript: 
<!DOCTYPE html>
<html>
<body>
    <script>
        
        let test = function(input) { console.log(input); };

        let keyPress = {};
        
        let testKeys = function() {
            
            if (keyPress['a'] && !keyPress['d']) {
                test('A, Left');
            }
            
            if (keyPress['d'] && !keyPress['a']) {
                test('D, Right');
            }
            
            if (keyPress[' ']) {
                test('Spacebar, Run');
            }
            
            if (keyPress['w']) {
                test('W, Jump');
            }
            
            if (keyPress['a'] && keyPress['w'] && keyPress[' ']) {
                test('Jump running to the left');
            }
          
            if (keyPress['d'] && keyPress['w'] && keyPress[' ']) {
                test('Jump running to the right');
            }
            requestAnimationFrame(testKeys);
        };

        testKeys();

        
        window.addEventListener('keydown', function(event) {
            keyPress[event.key.toLowerCase()] = true;
        });

        
        window.addEventListener('keyup', function(event) {
            keyPress[event.key.toLowerCase()] = false;
        });
    </script>
</body>
</html>
 
Upvote 0 Downvote
this could be because of key rollover or key ghosting

Code: 
<!DOCTYPE html>
<html>
<body>
    <script>
        let test = function(input) {
            console.log(input);
        };
      
        let keyPress = {};
        let testKeys = function() {
            // Log key status for debugging
            console.log(keyPress);

            // move left
            if (keyPress['a'] && !keyPress['d']) {
                test('A, Left');
            }
            // move right
            if (keyPress['d'] && !keyPress['a']) {
                test('D, Right');
            }
            // run
            if (keyPress[' ']) {
                test('Spacebar, Run');
            }
            // jump
            if (keyPress['w']) {
                test('W, Jump');
            }
            if (keyPress['a'] && keyPress['w'] && keyPress[' ']) {
                test('Jump running to the left');
            }
            // I Cannot get this to display
            if (keyPress['d'] && keyPress['w'] && keyPress[' ']) {
                test('Jump running to the right');
            };
            requestAnimationFrame(testKeys);
        };
        testKeys();

        window.addEventListener('keydown', keyDownListener);
        function keyDownListener(event) {
            keyPress[event.key] = true;
        };
        
        window.addEventListener('keyup', keyUpListener);
        function keyUpListener(event) {
            keyPress[event.key] = false;
        };
    </script>
</body>
</html>
try this code out with a few changes that i made it should work well
 
Upvote 0 Downvote

New Threads

Latest posts

Share this page

Buy us a coffee!

DataCamp Advertisement
Code Academy Advertisement

About Us

Code Forum is a community platform where coding enthusiasts can connect with other developers, engage in discussions, ask for help, and share their knowledge with a supportive community. It's a perfect place to improve your coding skills and to find a community of like-minded individuals who share your passion for coding.

Site links

Stay Connected

Back
Top Bottom