Comment appuyer sur Entrée sans soumettre le formulaire et soumettre le formulaire en php

Lorsque nous rédigeons un formulaire, nous rencontrons souvent une telle situation : lorsque l'utilisateur appuie sur Entrée dans la zone de saisie, le formulaire sera automatiquement soumis, ce qui peut facilement entraîner des problèmes tels qu'un mauvais fonctionnement et une perte d'informations.

Cet article vous présentera comment mettre en œuvre deux méthodes pour ne pas soumettre le formulaire et soumettre le formulaire en appuyant sur Entrée en PHP, afin de mieux répondre aux besoins des utilisateurs.

1. Enter ne soumet pas le formulaire

1 Utilisez JavaScript pour implémenter
Nous pouvons utiliser JavaScript pour empêcher le formulaire de se soumettre automatiquement au serveur lorsque l'utilisateur appuie sur la touche Entrée. Le code est le suivant :

<script>
    document.onkeydown = function(event) {
        var e = event ? event : (window.event ? window.event : null);
        if (e.keyCode == 13 && e.target.tagName.toLowerCase() != 'textarea') {
            //阻止表单提交
            return false;
        }
    }
</script>

2. Utilisez jQuery pour implémenter

De plus, nous pouvons également utiliser la méthode PreventDefault() dans jQuery pour empêcher la soumission de formulaire. Le code est le suivant :

<script>
    $(document).on('keydown', function(event) {
        if (event.keyCode == 13 && event.target.tagName.toLowerCase() != 'textarea') {
            event.preventDefault();
        }
    });
</script>

2. Appuyez sur Entrée pour soumettre le formulaire

Si nous voulons que l'utilisateur soumette automatiquement le formulaire en appuyant sur la touche Entrée après avoir saisi les informations, nous pouvons le faire de deux manières.

1. Utilisez JavaScript pour implémenter

Nous pouvons écouter l'événement de la touche Entrée dans la zone de texte et déclencher l'événement de soumission du formulaire lorsque l'utilisateur appuie sur la touche Entrée. Le code est le suivant :

<script>
    function submitForm() {
        document.formName.submit(); //提交表单
    }

    document.getElementById('input').onkeydown = function(event) {
        var e = event ? event : (window.event ? window.event : null);
        if (e.keyCode == 13) {
            submitForm();
        }
    }
</script>

2. l'attribut form de HTML5

En HTML5, nous pouvons utiliser l'attribut form pour lier la zone de saisie au formulaire, de sorte que lorsque l'utilisateur appuie sur la touche Entrée dans la zone de saisie, le formulaire sera automatiquement soumis. Le code est le suivant :

<form action="submit.php" method="post">
    <input type="text" id="input" name="input" form="myform" />
    <button type="submit" form="myform">提交</button>
</form>

Dans cet exemple, l'attribut form de la zone de saisie pointe vers l'ID du formulaire, et l'attribut form du bouton de soumission pointe également vers l'ID du formulaire. De cette façon, lorsque l'utilisateur appuie sur la touche Entrée, le contenu de la zone de saisie sera soumis au serveur.

Résumé

Lors de la rédaction de formulaires Web, nous devons prendre en compte les habitudes comportementales et les besoins de l'utilisateur pour améliorer l'expérience utilisateur. Cet article présente comment implémenter deux méthodes consistant à appuyer sur Entrée sans soumettre le formulaire et à appuyer sur Entrée pour soumettre le formulaire en PHP. J'espère que cet article pourra vous apporter de l'aide.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!