123 votes

Comment déclencher un bouton HTML lorsque vous appuyez sur Enter dans une zone de texte ?

Donc le code que j'ai jusqu'à présent est :

<fieldset id="LinkList">
    <input type="text" id="addLinks" name="addLinks" value="http://">
    <input type="button" id="linkadd" name="linkadd" value="add">
</fieldset>

Ce n'est pas dans un <form> et est juste tel qu'il est dans un <div> . Cependant, lorsque je tape quelque chose dans le champ textbox appelé "addLinks" Je veux que l'utilisateur puisse appuyer sur Enter et déclencher le "linkadd". button qui exécutera ensuite une fonction JavaScript.
Comment puis-je le faire ?
Merci

Edit : J'ai trouvé ce code, mais il ne semble pas fonctionner.

$("#addLinks").keyup(function(event){
    if(event.keyCode == 13){
        $("#linkadd").click();
    }
});

3voto

Sud Points 31

Cela fonctionne lorsque l'input type="button" est remplacé par l'input type="submit" pour le bouton par défaut qui doit être déclenché.

1voto

Anshu Points 7149

Ceci devrait faire l'affaire, j'utilise jQuery, vous pouvez écrire du simple javascript.
Remplacer sendMessage() avec votre fonctionnalité.

$('#addLinks').keypress(function(e) {
    if (e.which == 13) {
        sendMessage();
        e.preventDefault();
    }
});

1voto

Milind Anantwar Points 21710

Tout d'abord, ajoutez le fichier de la bibliothèque jquery jquery et l'appeler dans votre tête html.

et ensuite utiliser un code basé sur jquery...

$("#id_of_textbox").keyup(function(event){
    if(event.keyCode == 13){
        $("#id_of_button").click();
    }
});

1voto

Pablo Werlang Points 354

En me basant sur des réponses précédentes, j'ai trouvé ceci :

<form>
  <button id='but' type='submit'>do not click me</button>
  <input type='text' placeholder='press enter'>
</form>

$('#but').click(function(e) {
  alert('button press');
  e.preventDefault();
});

Jetez un coup d'œil à la Violon

EDIT : Si vous ne voulez pas ajouter d'éléments html supplémentaires, vous pouvez le faire avec JS seulement :

    $("input").keyup(function(event) {
        if (event.keyCode === 13) {
            $("button").click();
        }
    });

0voto

Scott Tovey Points 21

J'ai trouvé le howto de w3schools.com, leur page try me est à l'adresse suivante.

https://www.w3schools.com/howto/tryit.asp?filename=tryhow_js_trigger_button_enter

Cela a fonctionné dans mon navigateur ordinaire mais pas dans mon application php qui utilise le navigateur php intégré.

Après avoir joué un peu, j'ai trouvé l'alternative suivante, purement JavaScript, qui fonctionne dans ma situation et devrait fonctionner dans toutes les autres situations :

    function checkForEnterKey(){
        if (event.keyCode === 13) {
            event.preventDefault();
            document.getElementById("myBtn").click();
        }
    }

    function buttonClickEvent()
    {
        alert('The button has been clicked!');
    }

HTML Appuyez sur la touche entrée à l'intérieur de la zone de texte pour activer le bouton.

    <br />
    <input id="myInput" onkeyup="checkForEnterKey(this.value)">
    <br />
    <button id="myBtn" onclick="buttonClickEvent()">Button</button>

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X