Comment puis-je implémenter une boîte de dialogue de confirmation de soumission de formulaire JavaScript avec des options de soumission et d'annulation ?

Soumission d'un formulaire JavaScript : boîte de dialogue de confirmation avec options de soumission et d'annulation

Utilisation d'une boîte de dialogue de confirmation JavaScript en ligne

Pour implémenter une boîte de dialogue de confirmation d'envoi de formulaire avec des options pour soumettre ou annuler, vous pouvez utiliser une boîte de dialogue de confirmation JavaScript en ligne. Cette boîte de dialogue affiche un message contextuel invitant l'utilisateur à confirmer l'envoi du formulaire et propose deux boutons : "OK" et "Annuler".

Pour utiliser une boîte de dialogue de confirmation JavaScript en ligne, ajoutez le code suivant à votre code HTML. form :

<code class="html"><form onsubmit="return confirm('Do you really want to submit the form?');"></code>

Utilisation d'une fonction externe pour la validation et la confirmation

Si vous devez effectuer une validation supplémentaire avant de demander une confirmation à l'utilisateur, vous pouvez créer une fonction JavaScript externe pour la validation et confirmation. Voici comment procéder :

1. Créez une fonction JavaScript qui effectue une validation et renvoie une valeur booléenne (vrai pour valide, faux pour non valide).

<code class="javascript">function validate(form) {

    // Validation code here ...

    if (!valid) {
        alert('Please correct the errors in the form!');
        return false;
    }
    else {
        return confirm('Do you really want to submit the form?');
    }
}</code>

2. Ajoutez la fonction au gestionnaire d'événements onsubmit de votre formulaire HTML.

<code class="html"><form onsubmit="return validate(this);"></code>

Personnalisation de la boîte de dialogue de confirmation

Vous pouvez personnaliser le message et les étiquettes des boutons de la boîte de dialogue de confirmation à l'aide du message et des boutons. options dans la fonction confirm(). Par exemple :

<code class="javascript">confirm({
  message: 'Are you sure you want to continue?',
  buttons: ['Yes', 'No', 'Cancel']
});</code>

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!