JavaScript - Simuler la touche "Entrée" sur un input

Résolu
Baptiste_xls Messages postés 15 Date d'inscription mercredi 3 février 2021 Statut Membre Dernière intervention 2 août 2022 - 2 août 2022 à 14:43
Baptiste_xls Messages postés 15 Date d'inscription mercredi 3 février 2021 Statut Membre Dernière intervention 2 août 2022 -

Bonjour à tous, 

J'ai un input sur lequel j'aimerais déclencher la touche entrée à l'aide de JavaScript. 

<input id="codeReservation" type="text" value ="6" onkeypress="showData();">
// Déclenche l'event "Enter" en placant la position sur le input
// puis déclenche l'event grâce à un trigger
    var e = jQuery.Event("keypress");
        e.which = 13 
        e.keyCode = 13
        $('#codeReservation').focus();
        $('#codeReservation').trigger(e);

Voici la fonction associée :

function showData(){
        var e = window.event;
        var k = e.keyCode || e.which;
            if (k == 13)
            {...}
}

Cependant le window.event n'est pas reconnu. (undefined)

Est-ce que quelqu'un pourrait me suggérer une alternative svp ? 

Merci d'avance, 

Baptiste

A voir également:

2 réponses

Réponse 1 / 2
Baptiste_xls Messages postés 15 Date d'inscription mercredi 3 février 2021 Statut Membre Dernière intervention 2 août 2022 1
2 août 2022 à 14:58

J'ai mis la condition dans le input et ça a marché.

<input class="form-control" id="codeReservation" type="text" maxlength="6" size="3" onkeypress="if (event.keyCode == 13) showData()">

Bonne journée, 

Baptiste
1
Réponse 2 / 2
Totoro
2 août 2022 à 15:02

Salut,

window.event est en effet déprécié depuis un bail:

https://developer.mozilla.org/en-US/docs/Web/API/Window/event

Cela n'a d'ailleurs jamais été une solution correcte vu que son alternative est tellement plus efficace et pratique; la voici:

https://developer.mozilla.org/fr/docs/Web/API/EventTarget/addEventListener

Il faut bien entendu supprimer l'attribut onkeypress pour regrouper tout le code dans le javascript(ce qui est mieux) et qui n'a aucun sens relié à un input(vous mettez un input  HTML dans la page pour détecter un événement du clavier plutôt que détecter le clavier directement et si la touche entrée est enfoncée).

Et remplacer par :

window.addEventListener("keypress", function(e){
console.log('code touche enfoncée = '+e.keyCode)

},
false);

Éventuellement remplacer keypress par keydown qui est plus précis dans la plupart des cas (car keydown détecte/agit quand la touche est enfoncée)et remplacer la fonction anonyme par une fonction nommée pour pouvoir la supprimer si besoin.

Si vous voulez n'avoir le comportement/event que lorsque l'input est actif il faudra rajouter un event "focus" puis inclure la détection de la touche entrée dans celui ci(en imbriquant les fonctions l'une dans l'autre).

https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event

ps: un input est fait pour être dans un formulaire, cela fonctionnera si ce n'est pas le cas mais reste faux en HTML donc nuit au bon référencement des contenus.
1
Baptiste_xls Messages postés 15 Date d'inscription mercredi 3 février 2021 Statut Membre Dernière intervention 2 août 2022 1
2 août 2022 à 15:07

Merci pour votre réponse.

J'en prend note pour les prochaines fois ;) 

Baptiste

0

Discussions similaires

COCO : où aller ensuite ?
MysticMagic77 -
bendrop -

1 réponse