How to create a shortcut within a page?

Question

To add a new item in my database there is the button Add, however I would like to add a shortcut for you to perform the same function as the button. For example when the And in any question in the OS, this same goes into editing mode.

In my case I thought something like Shift + N to insert a new item.

Using the keydown it is possible to detect that only one key has been pressed, as shown in the example below:

$(document).keydown(function (e) {
    if (e.keyCode == 16) {   
      alert("O código "+ e.which + " que representa o Shift foi precionado");
    }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

To create the shortcut I thought something like:

if (e.keyCode == 16 && e.keyCode == 78) 

That in this case the 78 corresponds to the n, but it didn’t work that way.

How could I create a shortcut on my web page that would recognize the command shift+n?

Answer 1

The object evento brings read-only properties shiftKey, ctrlKey, altKey, metaKey (Mac command key or Windows key), which may be true or false.

You can build something like this:

$(document).keydown(function (e) {
    if (e.keyCode == 78 && e.shiftKey) {   
      alert("shift+n");
    }
});

The function passed to the keydown is invoked each time a key is pressed: if I press the SHIFT, it will trigger the event, and even with it pressed, if I hit the N, it will trigger the event again (second time). But there is that property that informs that the SHIFT is pressed.

So if you check with the if (e.keyCode == 16 && e.keyCode == 78), will not result in true why the event is fired twice:

1. when the SHIFT is pressed, event fired for the first time with the keyCode 16 and shiftKey: true (why is the shift that has been pressed);
2. when the N is pressed, event fired for the second time with the keyCode 78 and shiftKey: true.

Finally, the documentation says that if I keep pressing a key, it will invoke the function every time the operating system repeats it. For example, if you press and hold the key To, he will invoke the .keyDown once, wait a little, and soon after will invoke it several times in the sequence, as if the user had repeatedly pressing the key, because the operating system repeats it (as in any editor if we are holding a key for a while: it will be repeated several times).

But the same behavior does not happen with some special keys, among them the SHIFT. Operating system does not repeat it when you hold it down.

I created a fiddle that monitors the keydown and adds a row in the table to each key pressed, for testing: https://jsfiddle.net/mrlew/texabz01/

Answer 2

The object event brings information such as:

• Event.ctrlKey
• Event.altKey
• Event.metaKey
• Event.shiftKey

Try:

$(document).bind('keypress', function(event) {

        if( event.which === 78 && event.shiftKey ) {
            alert('pressione SHIFT+N');
        }
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>