0

I want to show/enable a div whenever I type a certain key-combination in the right order.

For example: 'open console{enter}' Now, there is no input field, no nothing. I simply open my site, type the text and a div should pop up. Such as a 'secret menu'.

How can I accomplish this without an actual inputfield?

Also, what could be the pros and cons?

Paramone
  • 2,634
  • 4
  • 31
  • 58
  • also be careful with this 'secret' things client side, as all the source code is accessible by the user – bviale Jun 01 '15 at 09:02
  • 1
    @Paramone, is it essential that there is no actual input field? I have successfully captured keystrokes with a 1px-wide input field that has no enclosing form, using jQuery library. – JohnRC Jun 01 '15 at 09:06
  • @JohnRC Actually, that doesn't even sound bad. Could you elaborate a little? Do you see the inputfield / how do you target it? It is however essential and necessairy that it is 'invisable'. – Paramone Jun 01 '15 at 09:13
  • Looks like @Snorlax's answer is what you need. – JohnRC Jun 01 '15 at 10:04

1 Answers1

1
$(document).on("keypress", function (e) {
    if(e.which == 13) {
        $("#div").show();
    }
});

Example: http://jsfiddle.net/ve6crpne/

e.which is which key. If the key is 13 (ENTER/Return) it will show the div with id = div.

If you wish to detect multiple keys in a row, add each key to a map and check it afterwards. Just like the duplicate question, which can be seen here: Detect multiple keys on single keypress event in jQuery - Really simple.

Community
  • 1
  • 1
MortenMoulder
  • 6,138
  • 11
  • 60
  • 116
  • 1
    Your code doesn't do what he asked, I don't understand how you've got 3 upvotes. If your answer is "follow the answer in this other SO question" then leave it flagged as duplicate. –  Jun 01 '15 at 09:52
  • Because I edited my post after it was duplicated. Did I answer his "How to make a div appear with JavaScript with keypresses" question? Yes. I added the "add to map" part after it was marked as a duplicate. – MortenMoulder Jun 01 '15 at 09:56
  • 2
    It wasn't "with *any* keypresses" was it? It was specific keypresses. You've wrote code that shows an element when enter is pressed. He didn't ask for that once in the question. –  Jun 01 '15 at 09:59
  • this does not answer the question. This code listens to only one keystroke, question says : "certain key-combination in the right order". – Asit Jun 01 '15 at 10:43