web-dev-qa-db-fra.com

Boîte d'alerte JavaScript avec confirmation à la pression du bouton

J'ai ce lien:

<p id="accept-favor"><a title="Accept this Favor" href="?wp_accept_favor=<?php comment_ID(); ?>">Accept this Favor</a></p>

Je souhaite afficher une boîte d'alerte JavaScript lorsqu'un utilisateur clique dessus en disant: "Êtes-vous sûr de vouloir accepter cette réponse comme votre faveur?" avec deux boutons l'un disant "Oui" qui permettra à la fonction de s'exécuter et l'autre disant "Non" qui annulera la publication et gardera l'utilisateur sur la page.

Comment pourrais-je faire ça? Merci :)

26
Cameron

Vous pouvez facilement le faire avec un clic de confirmation:

<p id="accept-favor"><a title="Accept this Favor" 
  href="?wp_accept_favor=<?php comment_ID(); ?>" 
  onclick="return confirm('Are you sure you would like to accept this reply as your favor?');"
  >Accept this Favor</a></p>

Bien que cela indique OK/Annuler au lieu de Oui/Non. Si vous voulez vraiment Oui/Non, vous devrez utiliser une boîte de dialogue personnalisée.

36
Kaleb Brasee

Vous pouvez écrire onclick="return confirm('Are you sure?');".

La fonction confirm affiche une boîte de dialogue OK/Annuler et renvoie true si l'utilisateur a cliqué sur OK.
returning false à partir d'un gestionnaire onclick annulera l'action par défaut du clic.

21
SLaks

Vous pouvez utiliser cette fonction:

myFunction() {
     var x;
     if (confirm("Are you sure?") == true) {
         x = "You pressed OK!";
     } else {
         x = "You pressed Cancel!";
     }
     return x; 
}
myFunction();
9
sailaja.p

Comme d'autres réponses parlent de direct onclick, je voudrais présenter une solution pour une version "plus agréable" (IMO = à mon avis) utilisant les addEventListener et preventDefault méthodes. Parce que de cette façon, vous pourriez lier plus de gestionnaires -.

[~ # ~] html [~ # ~]

<a href="#" id="confirmClickActionElementId">click me</a>

JavaScript

document
    .getElementById("confirmClickActionElementId")
    .addEventListener("click", function( e ){ //e => event
        if( ! confirm("Do you really want to do this?") ){
            e.preventDefault(); // ! => don't want to do this
        } else {
            //want to do this! => maybe do something about it?
            alert('Ok, lets do this!');
        }
    });

Violon: http://jsfiddle.net/ouyf86ya/

... ou l'ancienne méthode "return":

document
    .getElementById("confirmClickActionElementId")
    .addEventListener("click", function(  ){ 
        return confirm("Do you really want to do this?") ;
    });

Violon: http://jsfiddle.net/y2jLpkbb/

0
jave.web