Home / Questions / 58438
Accepted
Danilo
Asked: 2020-03-28 18:57:21 +0800 CST 2020-03-28 18:57:21 +0800 CST

How to use hotkeys with jquery?

  • 772

I would like to know how to use hotkeys in jquery.

Currently for the click events of a button it is used in this way:

 $("#id_boton").on('click', function (e) {
 //codigo ...
 });

In the case of the row of a datatable:

$('#idtable tbody').on('click', 'input.elimina_fila', function () {
 //codigo
});

but I would like to know for example when I press the A key, and also the F1,F2,F3 key. But also, when one presses the F1 key, a browser tab (help) opens, for those cases, I would like to know how to block that action.

But in the case of a table row, how would it be. For example, in the table row, there is a button type input that has a class called delete_row , where in the same input, there is a data-value and in the event, it received the value with this data, like this:

$('#idtable tbody').on('click', 'input.elimina_fila', function () {
var valor= $(this).data("valor");

});

How would I do it in the case that I will position myself in the row of a table and then press enter, where in the event, capture the data's?

I would like to know how or what events I should use when I press a button, and when I am in the row of a datatable.

I hope I can have your help

javascript

1 Answers

  1. Best Answer

    To block the action of hotkeys as F1it would be like this. always varying the KeyCode of the pressed key. this page can help to obtain the KeyCode of a key

    $(function() {
    $(document).on('keydown', 'body', function(event) {
        if(event.keyCode==112){ //F1
            event.preventDefault();
         }
     });
 });

    If you want to prevent more than one key, taking into account that this example applies to bodyif you want to do it in one inputor another element, you would have to modify indicating the IDor Clasespecifies it.

     $(function() {
    $(document).on('keydown', 'body', function(event) {
                    //cambiar body por input.elimina_fila por ejemplo
        var array= [112,113,114,115];//F1,F2,F3,F4
         if(array.includes(event.keyCode)) {
            event.preventDefault();
         }
     });
 });

    For an Input of a table it would be something similar

    $(function() {
    $('#idtable tbody').on('keydown', 'input.elimina_fila', function(event) {
                    //cambiar body por input.elimina_fila por ejemplo
        var array= [112,113,114,115];//F1,F2,F3,F4
         if(array.includes(event.keyCode)) {
            event.preventDefault();
         }
     });
 });
    • 3