J’ai un formulaire HTML avec une seule entrée de submit
, mais aussi divers éléments de button
. Lorsque l’utilisateur appuie sur la touche «Entrée», je m’attends à ce qu’il soumette effectivement le formulaire, mais à la place (dans Chrome 15 au moins), je trouve qu’il déclenche le premier button
(puisque cela se produit plus tôt dans le HTML que submit
entrée, je suppose).
Je sais qu’en général vous ne pouvez pas forcer les navigateurs à privilégier une entrée de submit
particulière, mais je pensais vraiment qu’ils préféreraient les entrées de submit
sur les éléments de button
. Puis-je modifier le code HTML pour que cela fonctionne, ou devrais-je adopter une approche Javascript?
Voici une maquette brute du HTML:
Vous pouvez utiliser jQuery:
$(function() { $("form input").keypress(function (e) { if ((e.which && e.which == 13) || (e.keyCode && e.keyCode == 13)) { $('button[type=submit] .default').click(); return false; } else { return true; } }); });
Vous n’avez pas besoin de JavaScript pour choisir votre bouton ou entrée de soumission par défaut. Il suffit de marquer avec type="submit"
, et les autres boutons les marquent avec type="button"
. Dans votre exemple:
Essayez ceci, si la touche Entrée a été pressée, vous pouvez la capturer comme ceci, par exemple, j’ai développé une réponse à l’autre bouton html spécifié , voir si cela aide.
Spécifiez le nom des formulaires, par exemple yourFormName
vous devriez alors pouvoir soumettre le formulaire sans vous concentrer sur le formulaire.
document.onkeypress = keyPress; function keyPress(e){ var x = e || window.event; var key = (x.keyCode || x.which); if(key == 13 || key == 3){ // myFunc1(); document.yourFormName.submit(); } }
J’ai juste un problème avec ça. Le mien était une chute de changer l’ input
sur un button
et j’avais un terminateur de tag mal écrit />
:
Donc j’ai eu:
Login
Et viens de le modifier pour:
Maintenant fonctionne comme un charme, toujours les petites choses ennuyeuses … HTH
Etant donné qu’il n’y a qu’un seul bouton (ou avec cette solution potentiellement pas même un), voici la solution basée sur jQuery qui fonctionnera pour plusieurs formulaires sur la même page …
Je viens de donner un tourbillon à la fois dans Chrome et Firefox et IE10.
Comme mentionné ci-dessus – assurez-vous que vous avez bien marqué avec type = “button”, “reset”, “submit”, etc. pour vous assurer qu’il fonctionne correctement et choisit le bon bouton.
Peut-être aussi les mettre tous sous la même forme (c.-à-d. Tout ce qui a fonctionné pour moi)
$("form#submit input").on('keypress',function(event) { event.preventDefault(); if (event.which === 13) { $('button.submit').sortinggger('click'); } });