Maison > interface Web > tutoriel CSS > Comment empêcher la soumission d'un formulaire et créer une nouvelle ligne avec Shift Enter dans une zone de texte ?

Comment empêcher la soumission d'un formulaire et créer une nouvelle ligne avec Shift Enter dans une zone de texte ?

Susan Sarandon
Libérer: 2024-12-04 18:09:12
original
465 Les gens l'ont consulté

How to Prevent Form Submission and Create a New Line with Shift Enter in a Textarea?

Comment détecter « Shift Enter » et générer une nouvelle ligne dans Textarea ?

Dans les soumissions de formulaires, appuyer sur Entrée déclenche généralement la soumission du formulaire . Cependant, dans de nombreuses zones de texte, il est souhaitable de permettre aux utilisateurs d'appuyer sur Maj Entrée pour créer une nouvelle ligne.

Solution 1 : Modification du script de soumission de formulaire

Si votre Le formulaire est soumis sur Entrée en raison d'un script spécifique, localisez ce script et modifiez-le pour le soumettre uniquement lorsque vous appuyez sur Entrée sans Maj. Par exemple, remplacez ce code :

if (evt.keyCode == 13) {
    form.submit();
}
Copier après la connexion

Par ceci :

if (evt.keyCode == 13 && !evt.shiftKey) {
    form.submit();
}
Copier après la connexion

Solution 2 : Gestion des événements clés (pour tous les navigateurs)

Si vous n'avez pas accès au script de soumission du formulaire, vous pouvez utiliser JavaScript pour gérer les événements clés et insérer une nouvelle ligne lorsque Shift Enter est enfoncé.

function handleEnter(evt) {
    if (evt.keyCode == 13 && evt.shiftKey) {
        if (evt.type == "keypress") {
            pasteIntoInput(this, "\n");
        }
        evt.preventDefault();
    }
}

// Handle both keydown and keypress for Opera
$("#your_textarea_id").keydown(handleEnter).keypress(handleEnter);
Copier après la connexion

Ce code insère une nouvelle ligne dans la zone de texte lorsque vous appuyez sur une touche si Shift Enter est enfoncé. Il gère les cas extrêmes en utilisant à la fois les événements keydown et keypress.

Remarque : Cette solution nécessite une bibliothèque externe ou un code personnalisé pour coller le caractère de nouvelle ligne dans la zone de texte à la position correcte du curseur.

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!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal