web-dev-qa-db-fra.com

Empêcher un lien, confirmer, puis aller à l'emplacement jQuery

J'ai des liens comme ça.

<a href="delete.php?id=1" class="delete">Delete</a>

Si un utilisateur clique dessus. Une confirmation devrait apparaître et alors seulement si l'utilisateur clique sur Oui, il devrait aller à l'URL réelle.

Je sais que cela peut empêcher le comportement par défaut 

    function show_confirm()
    {
    var r=confirm("Are you sure you want to delete?");
    if (r==true)   {  **//what to do here?!!** }

    }    


    $('.delete').click(function(event) {
    event.preventDefault();
    show_confirm()
    });

Mais comment puis-je continuer vers ce lien ou envoyer un message ajax à ce lien après confirmation?

jquerypopupconfirmationpreventdefault
17
esafwan

vous pouvez tout faire en un clic:

$('.delete').click(function(event) {
    event.preventDefault();
    var r=confirm("Are you sure you want to delete?");
    if (r==true)   {  
       window.location = $(this).attr('href');
    }

});

Ou vous pouvez le faire en passant l'élément cliqué à la fonction:

function show_confirm(obj){
    var r=confirm("Are you sure you want to delete?");
    if (r==true)  
       window.location = obj.attr('href');
}    
$('.delete').click(function(event) {
    event.preventDefault();
    show_confirm($(this));

});
32
locrizak

Il m'a fallu un certain temps pour comprendre cela, alors j'ai décidé de poster ma solution.

$('.delete').click(function(e){
    if(confirm('Are you sure?')){
        // The user pressed OK
        // Do nothing, the link will continue to be opened normally
    } else {
        // The user pressed Cancel, so prevent the link from opening
        e.preventDefault();
    }
}

Je pensais à confirmer le mauvais sens. Confirmez pour empêcher le site de s'ouvrir automatiquement et attendez la saisie de l'utilisateur. Donc, fondamentalement, vous devez déplacer votre preventDefault vers le reste. 

Donc, vous empêchez le lien de s'ouvrir uniquement si vous cliquez sur Annuler. Cela permet également au lien de fonctionner normalement, par exemple s'il a une instruction target = "_ blank".

3
Travis Heeter
function show_confirm(url){
    var r=confirm("Are you sure you want to delete?");
    if (r==true){
        location.top.href = url;
    }
}    


$('.delete').click(function(event) {
    event.preventDefault();
    show_confirm($(this).attr('href'));
});

Si vous voulez utiliser ajax, vous pouvez remplacer location.top.href = url; par $.get(url);

2
Paulpro
function show_confirm(elem)
{
    var r=confirm("Are you sure you want to delete?");
    if (r==true) { 
        window.location.href = elem.href;
    }
}    

$('.delete').click(function(event) {
    event.preventDefault();
    show_confirm(this)
});
2
ChristopheCVB

Pour optimiser le code dans la fonction show_confirm, essayez d'utiliser ci-dessous:

function show_confirm(obj){
   if(confirm("Are you sure you want to delete?")) window.location = obj.attr('href');
}
1
Chanraksmey

C'est un formulaire court:

$('.delete').click(function(){return confirm("Are you sure you want to delete?")});

Je l'utilise sur des sites Web pour le téléchargement/la confirmation de lien.

1
Matteo Conta

vous pourriez faire

function show_confirm()
    {
    if(confirm("Are you sure you want to delete?")){
        //make ajax call
     }else{

          //no ajax call
     }

    }
0
Nicola Peluchetti
 $('.delete').click(function() {

   if (confirm('Are you sure?')) {
     $.post($(this).attr('href'), function() {
       // Delete is OK, update the table or whatever has to be done after a succesfull delete
      ....
     }
   }

   return false;

}
0
Claudio

Si vous souhaitez utiliser alert/confirm, c’est le meilleur moyen (je préfère utiliser Confirmation Bootstrap ou bootbox ): 

$('.confirm-delete').click( function( event ) {
    if ( !confirm('Are you sure?') ) event.preventDefault();
});
0
Roy Shoa