Question

I want to make it so that if a user on the html page presses the letters A, H, then A, an alert box comes up saying “Aha, you’ve found the secret!”

How do I accomplish this with Jquery, Javascript, etc?

Answer 1

There are more efficient ways to do this, but I figured this is the best way to demonstrate to you the core principles at work. This is using key down event handlers, and the jQuery framework.

var step1 = false;
var step2 = false;

$(document).keyup(function(event) {
    if (step2) {
    // Step 2 - Represents we've cleared both A (1) and H
        if (event.keyCode == '65') {
            // We've found the last A!
            step2 = false;
            step1 = false;
            alert("Aha! You've found the secret!");
        } else {
            // It was a key other than A :( Reset to start
            step2 = false;
        }
    } else if (!step1) {
        // Step 1 - Represents we haven't started our chain yet
        if (event.keyCode == '65') {
            // Someone pressed A! Step 1 is DONE!
            step1 = true;
        }
    } else {
        // Step 1 is done, but we're waiting on Step 2... Will it be?
        if (event.keyCode == '72') {
            // H has been pressed! We're cleared through Step 2
            step2 = true;
            step1 = false;
        } else {
            // H wasn't press :(, Let's go back to the start
            step1 = false;
        }
    }
});

Addendum : It’s worth noting that the integer 65 represents a keyboard press of the letter a and 72 a keyboard press of the letter h