web-dev-qa-db-fra.com

Manière définitive de déclencher des événements de pression de touche avec jQuery

J'ai lu toutes les réponses à ces questions et aucune des solutions ne semble fonctionner.

De plus, j'ai l'impression que le déclenchement de la frappe avec des caractères spéciaux ne fonctionne pas du tout. Quelqu'un peut-il vérifier qui a fait cela?

250
mkoryak

Si vous souhaitez déclencher l'événement de frappe ou de frappe, il vous suffit de:

var e = jQuery.Event("keydown");
e.which = 50; // # Some key code value
$("input").trigger(e);
350
Nadia Alramli

Un peu plus concis maintenant avec jQuery 1.6 + :

var e = jQuery.Event( 'keydown', { which: $.ui.keyCode.ENTER } );

$('input').trigger(e);

(Si vous n'utilisez pas l'interface utilisateur jQuery, insérez plutôt le code clé approprié.)

78
nickb

La vraie réponse doit inclure keyCode:

var e = jQuery.Event("keydown");
e.which = 50; // # Some key code value
e.keyCode = 50
$("input").trigger(e);

Même si le site Web de jQuery indique que les éléments qui et KeyCode sont normalisés, ils se trompent énormément. Il est toujours plus sûr d'effectuer les vérifications multi-navigateurs standard pour e.which et e.keyCode et, dans ce cas, il suffit de définir les deux.

68
Tomas

Si vous utilisez également l'interface utilisateur de jQuery, vous pouvez procéder comme suit:

var e = jQuery.Event("keypress");
e.keyCode = $.ui.keyCode.ENTER;
$("input").trigger(e);
17
Rodrigo Chacon

Je l'ai fait fonctionner avec keyup.

$("#id input").trigger('keyup');
5
Abba

Ok, pour moi ça marche avec ça ...

var e2key = function(e) {
    if (!e) return '';
    var event2key = {
        '96':'0', '97':'1', '98':'2', '99':'3', '100':'4', '101':'5', '102':'6', '103':'7', '104':'8', '105':'9', // Chiffres clavier num
        '48':'m0', '49':'m1', '50':'m2', '51':'m3', '52':'m4', '53':'m5', '54':'m6', '55':'m7', '56':'m8', '57':'m9', // Chiffres caracteres speciaux
        '65':'a', '66':'b', '67':'c', '68':'d', '69':'e', '70':'f', '71':'g', '72':'h', '73':'i', '74':'j', '75':'k', '76':'l', '77':'m', '78':'n', '79':'o', '80':'p', '81':'q', '82':'r', '83':'s', '84':'t', '85':'u', '86':'v', '87':'w', '88':'x', '89':'y', '90':'z', // Alphabet
        '37':'left', '39':'right', '38':'up', '40':'down', '13':'enter', '27':'esc', '32':'space', '107':'+', '109':'-', '33':'pageUp', '34':'pageDown' // KEYCODES
    };
    return event2key[(e.which || e.keyCode)];
};

var page5Key = function(e, customKey) {
    if (e) e.preventDefault();
    switch(e2key(customKey || e)) {
        case 'left': /*...*/ break;
        case 'right': /*...*/ break;
    }
};

$(document).bind('keyup', page5Key);

$(document).trigger('keyup', [{preventDefault:function(){},keyCode:37}]); 
4
molokoloco

De vous voulez le faire en une seule ligne, vous pouvez utiliser

$("input").trigger(jQuery.Event('keydown', { which: '1'.charCodeAt(0) }));

Si vous devez prendre en compte le curseur et la sélection de texte en cours ...

Cela ne fonctionnait pas pour moi pour une application AngularJS sur Chrome. Comme Nadia le fait remarquer dans les commentaires originaux, le caractère n'est jamais visible dans le champ de saisie (du moins, c'était mon expérience). De plus, les solutions précédentes ne prennent pas en compte la sélection de texte actuelle dans le champ de saisie. Je devais utiliser une merveilleuse bibliothèque jquery-selection .

J'ai un clavier numérique personnalisé à l'écran qui remplit plusieurs champs de saisie. J'ai dû...

  1. Sur le focus, enregistrer le lastFocus.element
  2. En cas de flou, enregistrez la sélection de texte actuelle (début et fin)

    var pos = element.selection('getPos')
    lastFocus.pos = { start: pos.start, end: pos.end}
    
  3. Lorsque vous appuyez sur un bouton du clavier my:

    lastFocus.element.selection( 'setPos', lastFocus.pos)
    lastFocus.element.selection( 'replace', {text: myKeyPadChar, caret: 'end'})
    
2
Flint O'Brien

console.log( String.fromCharCode(event.charCode) );

pas besoin de mapper le personnage je suppose.

1
Weldan Jamili

Cela peut être accompli comme ceci docs

$('input').trigger("keydown", {which: 50});
1
Bek