eine Funktion wie window.confirm, die wahr oder falsch zurückgeben basierend auf den Knopf klicken

Question

Ich versuche, eine Funktion wie window.confirm zu schaffen, die wie folgt verwendet werden kann:

if (I.confirmDialog.open("Do you really want to Cancel")) { 
    // do this 
} 
else { 
    // do this 
} 

Ich schreibe die Pop- up-Funktion wie folgt aus:

I.confirmDialog = { 

    open: function(confirmMsg) { 

    var $modal = I.modals.new("small confirm-dialog"); 
    $modal.find("h1").text(confirmMsg); 
    $modal.append("<div class=\"action-wraper\"><a class=\"action-yes\" href=\"javascript:void(0);\">Yes</a><a class=\"action-no\"href=\"javascript:void(0);\">No</a></div>"); 
    I.modals.open($modal); 
    $modal.find(".action-yes").click(function() { I.modals.close(); /* return true will not work*/ }); 
    $modal.find(".action-no").click(function() { I.modals.close(); /* return false will not work*/ }); 

    } 

}; 

Aber das Problem ist, ich bin nicht in der Lage von der I.confirmDialog.open() wahr oder falsch zurück. Die Ausführung der Funktion I.confirmDialog.open() wartet nicht auf das Klicken auf die Schaltfläche, und die Rückgabe aus dem Klick-Callback wirkt sich nicht auf den Rückgabewert I.confirmDialog.open() aus.

Ich mag würde wissen, wie window.confirm

Answer 1

wenn möglich geschrieben

Das Problem, das Sie hier haben, ist, dass die modale actioned wird effektiv asynchron ist (wie Sie für die Benutzereingabe warten), so dass Sie nicht return etwas.

Stattdessen bieten einige Callback-Funktionen zu dem Verfahren, das in den erforderlichen Ereignisse aufgerufen werden können:

I.confirmDialog = { 
    open: function(confirmMsg, yesCallback, noCallback) { 
     var $modal = I.modals.new("small confirm-dialog"); 
     $modal.append('<div class="action-wraper"><a class="action-yes" href="#">Yes</a><a class="action-no" href="#">No</a></div>').find("h1").text(confirmMsg); 

     I.modals.open($modal); 

     $modal.find(".action-yes").click(function(e) { 
      e.preventDefault(); 
      I.modals.close(); 
      yesCallback && yesCallback(); 
     }); 

     $modal.find(".action-no").click(function(e) { 
      e.preventDefault(); 
      I.modals.close(); 
      noCallback && noCallback(); 
     }); 
    } 
}; 

Sie würden dann wie folgt aufrufen:

I.confirmDialog.open("Do you really want to Cancel", function() { 
    console.log('you clicked YES'); 
}, function() { 
    console.log('you clicked NO'); 
});