web-dev-qa-db-fra.com

Désactiver la soumission du formulaire via la touche Entrée sur seulement _certains champs

Je souhaite conserver le comportement conventionnel "soumission de formulaire lorsque j'appuie sur Entrée" car les utilisateurs sont familiers avec. Mais par réflexe, ils appuient souvent sur Entrée lorsqu'ils finissent avec une zone de saisie de texte - mais avant d'avoir fini le formulaire complet.

Je voudrais détourner la touche Entrée uniquement lorsque le focus est sur une certaine classe d'entrée.

Recherche Questions connexes cela ressemble à ce que je recherche:

if (document.addEventListener) {
    document.getElementById('strip').addEventListener('keypress',HandleKeyPress,false);
} else {
    document.getElementById('strip').onkeypress = HandleKeyPress;
}

mais la partie if (document.addEventListener) { ne m'est pas familière.

72
justSteve

Vous pouvez capturer et annuler la saisie keypress sur ces champs comme celui-ci:

$('.noEnterSubmit').keypress(function(e){
    if ( e.which == 13 ) return false;
    //or...
    if ( e.which == 13 ) e.preventDefault();
});

Ensuite, sur vos entrées, donnez-leur simplement un class="noEnterSubmit" :)

Pour l'avenir au cas où d'autres trouveraient cela plus tard, dans jQuery 1.4. (pas encore sorti), vous pouvez le raccourcir à ceci:

$('.noEnterSubmit').bind('keypress', false);
133
Nick Craver

Ajoutez simplement le code suivant dans <Head> Tag dans votre code HTML. Il formulera la soumission sur Entrer la clé Pour tous les champs du formulaire

<script type="text/javascript">
    function stopEnterKey(evt) {
        var evt = (evt) ? evt : ((event) ? event : null);
        var node = (evt.target) ? evt.target : ((evt.srcElement) ? evt.srcElement : null);
        if ((evt.keyCode == 13) && (node.type == "text")) { return false; }
    }
    document.onkeypress = stopEnterKey;
</script>
3
Kailas Mane

Pour autoriser la saisie uniquement sur une classe spécifique (dans cet exemple, "enterSubmit"):

jQuery(document).ready(function(){
    jQuery('input').keypress(function(event){
        var enterOkClass =  jQuery(this).attr('class');
        if (event.which == 13 && enterOkClass != 'enterSubmit') {
            event.preventDefault();
            return false;   
        }
    });
});
1
Silas Palmer
 <input type="text"  onkeydown="return (event.keyCode!=13);" />
1
stackuser