Remplacer keyCode dans IE 11

Nous utilisons ce code pour simuler la touche Tab avec la touche Entrée:
…
Lorsque je touche Entrer, je veux que le focus passe au prochain contrôle.

L'idée est fausse. Ne modifiez pas l'onglet entrer dans l'onglet. Débranchez ce problème en interceptant la touche enter, mettez l'accent sur l'élément suivant et annulez l'événement. Solution jQuery:

 $(function() { $("form").on("keypress", "input[type=text], select, textarea", function(e) { if (e.which === 13) { e.preventDefault(); var $fields = $(this).closest("form").find(":input"); var index = $fields.index(this); $fields.eq(index + 1).trigger("focus"); } }); }); 

 input, select, textarea { box-sizing: border-box; margin: .5em 0; width: 100%; } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <form method="post"> <p>Hitting enter inside the text fields will not submit the form</p> <textarea rows="4"></textarea> <input type="text" /> <select> <option>1</option> <option>2</option> <option>3</option> </select> <select> <option>A</option> <option>B</option> <option>C</option> </select> <input type="text" /> <input type="submit" value="sumbmit" /> </form> 

keyCode devrait être keyCode dans tous les navigateurs modernes, simplement parce que le modifier est hacker et inutile. En regardant le code que vous avez fourni dans votre autre question: l' événement de dépannage ne déclenche pas correctement en utilisant le déclenchement jQuery , nous pouvons imiter cette fonctionnalité plutôt que d'essayer de renvoyer l'événement modifié.

JQuery nous permet de modifier l'objet d' event lorsqu'il est transmis à un gestionnaire d'événements jQuery. Comme vous avez identifié jquery , nous pouvons donc utiliser ceci dans notre réponse, en passant les modifications en un trigger() appelé sur le même élément.

 if (e.which === 13) { // Alter the normalised e.which property e.which = 9; // Alter the default properties for good measure e.charCode = 9; e.keyCode = 9; $(this).trigger(e); return false; } 

Remarque: J'ai utilisé e.which plutôt que e.keyCode que jQuery normalise ceci sur tous les navigateurs.

Voici une démo qui montre cela en action. Si vous appuyez sur la touche Entrée lorsque l'élément de input est en mise au point, l'événement sera remplacé par l'événement Tab :

 var $input = $('input'), $p = $('p'); $input.on('keydown', function(e) { if (e.which == 13) { $p.html($p.html() + 'Enter key intercepted, modifying 13 to 9.<br>'); e.which = 9; e.charCode = 9; e.keyCode = 9; $(this).trigger(e); return false; } $p.html($p.html() + 'Key pressed: ' + e.keyCode + '<br>'); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <input type="text" /> <p></p> 

Cela a fonctionné dans IE9 mais ne fonctionne plus dans IE11. Donc, vous devez trouver une solution qui stimule le résultat souhaité. Par exemple, si vous souhaitez permettre aux utilisateurs d'appuyer sur 'Enter' pour passer au champ de saisie de données suivant (comme l'onglet Fait), essayez quelque chose comme ça.

 var i = 0; var els = myform.getElementsByTagName('input').length document.onkeydown = function(e) { e = e || window.event; if (e.keyCode == 13) { i++; i > els - 1 ? i = 0 : i = i; document.myform[i].focus(); } }; 

 <span>Press 'enter' inside text to act like tab button</span> <form name="myform"> <input type="text"> <input type="text"> <input type="text"> </form> 

Vous pouvez simplement sélectionner l'élément de formulaire suivant ou précédent après avoir saisi la touche Entrée.

Cela prendra tous les éléments de forme possibles. En appuyant sur shift-Enter, vous mettez l'accent sur l'élément de formulaire précédent.

En appuyant sur Entrer sur le bouton de soumission, vous enverrez toujours le formulaire. En appuyant sur shift-Enter, vous concentrez l'élément de formulaire précédent.

 function EnterTabTest(event) { if (!event.shiftKey && (event.target.getAttribute('type')=='submit')) return true; event.preventDefault(); if (event.keyCode == 13) { if (event.shiftKey) $(event.target).prevAll(":input").first().focus(); else $(event.target).nextAll(':input').first().focus(); } return false; } <form onkeydown='EnterTabTest(event)'> <input type='text' /> <input type='text' /> <input type='text' /> <p>not part of the form</p> <select> <option>opt1</option> <option>opt2</option> </select> <p>also not part of the form</p> <input type='text' /> <input type='submit' /> </form> 

Voici une violon pour pouvoir essayer

Il fonctionne également dans IE11, j'ai essayé.