Mousetrap.bind is not working when field is in focus?

Question

I am using Mousetrap for create keyboard shortcuts, it was not working when any fields in focus. This is the link for view demo http://davidwalsh.name/keyboard-shortcuts from where i get the code. when i use to call

Mousetrap.bind('ctrl+m', function () {
    var button = $('[data-action="next-page"]');
    if (button.length) {
        button[0].click()
    }
});

like this it not working , when mouse points in text-box or drop-down etc,. Can any give solution for me. Thanks in advance.

score 30 · Answer 1 · answered Jan 13 '14 at 18:21

30

By default mousetrap disable the shortcuts when the focus is on input fields, dropdown, etc.. If your problem is with only one field, include the class mousetrap in it. If you want to disable all scenarios try the following code

Mousetrap.stopCallback = function () {
     return false;
}

This will overwrite the initial behavior and allow shortcuts in any field of the screen.

answered Jan 13 '14 at 18:21

Gabriel Guarnieri Cardoso

668
7
21

19

as of v1.5.0, you need to make that Mousetrap.prototype.stopCallback = { ... } – jedierikb Jul 07 '15 at 14:49
1

I had an old additional script that used Mousetrap.stopCallback. Thanks! adding the prototype fixed my problem @jedierikb – Tyler Davis Jul 15 '15 at 19:57

score 2 · Answer 2 · answered Nov 26 '16 at 23:10

2

If you're using input or textarea or select elements, you must define the mousetrap class:

<textarea name="message" class="mousetrap"></textarea>

See the "Text fields" section in the oficial doc at https://craig.is/killing/mice

answered Nov 26 '16 at 23:10

zyc

344
3
7

Mousetrap.bind is not working when field is in focus?

2 Answers2