Hinzufügen jQuery Bestätigen Sie vor dem Abmelden

Question

Ich bin neu bei jQuery und ich verwende die Bestätigungsbox von here. Aber ich habe ein Problem, bei dem meine aktuelle Seite zurück zur Anmeldeseite umleitet, bevor ich meine Abmeldung im Dialogfeld bestätige.

Unten ist mein Skript:

$('a#logout').on('click', function() { 

         var isConfirmed = $.confirm({ 
          title: 'Logout Confirmation', 
          content: 'Are you sure you want to logout?', 
          buttons: { 
           confirm: function() { 
            // $.alert('Confirmed!'); 
            return true; 
           }, 
           cancel: function() { 
            // $.alert('Canceled!'); 
            return false; 
           }, 
          } 
         }); 

         if(isConfirmed == true){ 
          window.location.href="extra-login.html"; 
         } 

        }); 

Und das ist mein HTML

<a href="extra-login.html" id="logout"> Log Out <i class="entypo-logout right"></i> </a>

Jede Hilfe würde geschätzt. Danke im Voraus!

Answer 1

Das Problem ist Ihre Ankerelemente Standardaktion ist es, den Benutzer zur Anmeldeseite zu bringen, die nicht verhindert wird.

Sie können die event.preventDefault() aufrufen, dies zu tun.

Auch das confirm Plugin sieht wie ein nicht blockierendes Plugin aus, daher müssen Sie den Weiterleitungscode in den Success Handler verschieben.

$('a#logout').on('click', function(e) { 
    e.preventDefault(); 

    var isConfirmed = $.confirm({ 
    title: 'Logout Confirmation', 
    content: 'Are you sure you want to logout?', 
    buttons: { 
     confirm: function() { 
     window.location.href = "extra-login.html"; 
     }, 
     cancel: function() {}, 
    } 
    }); 
}); 

Answer 2

Ich vermute, der Dialog blockiert nicht (ich kenne keine, die in JS sind). Sie sollten nur Ihren Erfolgscode in dem Rückruf für die Bestätigungstaste setzen, etwa so:

$('a#logout').on('click', function() { 

         $.confirm({ 
          title: 'Logout Confirmation', 
          content: 'Are you sure you want to logout?', 
          buttons: { 
           confirm: function() { 
            // $.alert('Confirmed!'); 
            //I'm guessing this function is called when the button is clicked. 
            window.location.href="extra-login.html"; 
            return true; 
           }, 
           cancel: function() { 
            // $.alert('Canceled!'); 
            return false; 
           }, 
          } 
         }); 

        }); 

Aber der Hauptgrund Code sofort wird Umleitung ist der href Tag in Ihrem Link. Sie haben im Grunde eine Verbindung zu einer anderen Seite, die auch versucht, einige JS auszuführen, aber weil es ein Link ist, den es weiterleitet, bevor das JS sogar laufen kann. Tun Sie dies stattdessen:

Answer 3

: Ich bin auch ich hoffe, dass mein Vorschlag richtig ist aber, warum man nicht setzen href in bestätigen Funktion.

$('a#logout').on('click', function (event) { 
    var isConfirmed = $.confirm({ 
         title: 'Logout Confirmation', 
         content: 'Are you sure you want to logout?', 
         buttons: { 
          confirm: function() { 
           window.location.href="extra-login.html"; 
          }, 
          cancel: function() { 
           event.preventDefault(); 
          }, 
         } 
        }); 

}); 

Answer 4

Warum verwenden Sie nicht so -

$('a#logout').on('click', function(){ 
    if($(this).confirm({title: 'Logout Confirmation', content: 'Are you sure you want to logout?'})){ 
    window.location.href="extra-login.html"; 
}else{ 
    return false; 
} 
});