Tak lub Nie box Potwierdź za pomocą jQuery

Question

chcę tak/nie ma alertów przy użyciu jQuery, zamiast ok/przycisk Anuluj:

jQuery.alerts.okButton = 'Yes'; 
jQuery.alerts.cancelButton = 'No';     
jConfirm('Are you sure??', '', function(r) { 
    if (r == true) {      
     //Ok button pressed... 
    } 
} 

Wszelkie inne alternatywy?

Answer 1

ConfirmDialog('Are you sure'); 

function ConfirmDialog(message) { 
    $('<div></div>').appendTo('body') 
    .html('<div><h6>'+message+'?</h6></div>') 
    .dialog({ 
     modal: true, title: 'Delete message', zIndex: 10000, autoOpen: true, 
     width: 'auto', resizable: false, 
     buttons: { 
      Yes: function() { 
       // $(obj).removeAttr('onclick');         
       // $(obj).parents('.Parent').remove(); 

       $('body').append('<h1>Confirm Dialog Result: <i>Yes</i></h1>'); 

       $(this).dialog("close"); 
      }, 
      No: function() {                 
       $('body').append('<h1>Confirm Dialog Result: <i>No</i></h1>'); 

       $(this).dialog("close"); 
      } 
     }, 
     close: function (event, ui) { 
      $(this).remove(); 
     } 
    }); 
}; 

Proszę znaleźć Demo.

Answer 2

miałem kłopot odpowiedź z powrotem z okna dialogowego, ale w końcu wpadł na rozwiązanie łącząc odpowiedź od tej drugiej kwestii display-yes-and-no-buttons-instead-of-ok-and-cancel-in-confirm-box z części kodu z okna modalne-potwierdzającym

To, co było sugerowane do drugiego pytania:

utworzyć własną skrzynkę potwierdź:

<div id="confirmBox"> 
    <div class="message"></div> 
    <span class="yes">Yes</span> 
    <span class="no">No</span> 
</div> 

Stwórz własną metodę confirm():

function doConfirm(msg, yesFn, noFn) 
{ 
    var confirmBox = $("#confirmBox"); 
    confirmBox.find(".message").text(msg); 
    confirmBox.find(".yes,.no").unbind().click(function() 
    { 
     confirmBox.hide(); 
    }); 
    confirmBox.find(".yes").click(yesFn); 
    confirmBox.find(".no").click(noFn); 
    confirmBox.show(); 
} 

nazywają go przez kod:

doConfirm("Are you sure?", function yes() 
{ 
    form.submit(); 
}, function no() 
{ 
    // do nothing 
}); 

moje zmiany mam manipulowane wyżej tak, że zamiast nazywać confirmBox.show() użyłem confirmBox.dialog({...}) jak ten

confirmBox.dialog 
    ({ 
     autoOpen: true, 
     modal: true, 
     buttons: 
     { 
      'Yes': function() { 
      $(this).dialog('close'); 
      $(this).find(".yes").click(); 
      }, 
      'No': function() { 
      $(this).dialog('close'); 
      $(this).find(".no").click(); 
      } 
     } 
    }); 

Druga zmiana Uczyniłem to, aby utworzyć div z potwierdzeniem w funkcji doConfirm, tak jak zrobił to ThulasiRam w swojej odpowiedzi.

Answer 3

Wszystkie przykłady, które widziałem, nie nadają się do ponownego użycia dla różnych pytań typu "tak/nie". Szukałem czegoś, co pozwoliłoby mi określić wywołanie zwrotne, więc mogłem zadzwonić do każdej sytuacji.

Poniższy działa dobrze dla mnie:

$.extend({ confirm: function (title, message, yesText, yesCallback) { 
    $("<div></div>").dialog({ 
     buttons: [{ 
      text: yesText, 
      click: function() { 
       yesCallback(); 
       $(this).remove(); 
      } 
     }, 
     { 
      text: "Cancel", 
      click: function() { 
       $(this).remove(); 
      } 
     } 
     ], 
     close: function (event, ui) { $(this).remove(); }, 
     resizable: false, 
     title: title, 
     modal: true 
    }).text(message).parent().addClass("alert"); 
} 
}); 

I wtedy nazwać tak:

var deleteOk = function() { 
    uploadFile.del(fileid, function() {alert("Deleted")}) 
}; 

$.confirm(
    "CONFIRM", //title 
    "Delete " + filename + "?", //message 
    "Delete", //button text 
    deleteOk //"yes" callback 
); 

Answer 4

Zapraszamy do obejrzenia tej wtyczki jQuery: jquery.confirm.

<a href="home" class="confirm">Go to home</a> 

, a następnie:

$(".confirm").confirm(); 

Pokaże się okienko z potwierdzeniem, przed przystąpieniem do następujących link.

Jest demo tutaj: http://myclabs.github.com/jquery.confirm/

Answer 5

Alert metoda blokuje wykonanie aż użytkownik zamyka go:

użyć funkcji Potwierdź:

if (confirm('Some message')) { 
    alert('Thanks for confirming'); 
} else { 
    alert('Why did you press cancel? You should have confirmed'); 
} 

Answer 6

mam używany te kody:

HTML:

<a id="delete-button">Delete</a> 

jQuery:

<script> 
$("#delete-button").click(function(){ 
    if(confirm("Are you sure you want to delete this?")){ 
     $("#delete-button").attr("href", "query.php?ACTION=delete&ID='1'"); 
    } 
    else{ 
     return false; 
    } 
}); 
</script> 

Te kody działa na mnie, ale nie jestem pewien, czy to jest właściwe. Co myślisz?

Answer 7

można ponownie użyć potwierdzić:

function doConfirm(body, $_nombrefuncion) 
    { var param = undefined; 
     var $confirm = $("<div id='confirm' class='hide'></div>").dialog({ 
      autoOpen: false, 
      buttons: { 
       Yes: function() { 
       param = true; 
       $_nombrefuncion(param); 
       $(this).dialog('close'); 
      }, 
       No: function() { 
       param = false; 
       $_nombrefuncion(param); 
       $(this).dialog('close'); 
      } 
            } 
     }); 
     $confirm.html("<h3>"+body+"<h3>"); 
     $confirm.dialog('open');          
    }; 

// for this form just u must change or create a new function for to reuse the confirm 
    function resultadoconfirmresetVTyBFD(param){ 
     $fecha = $("#asigfecha").val(); 
     if(param ==true){ 
       // DO THE CONFIRM 
     } 
    } 

//Now just u must call the function doConfirm 
    doConfirm('body message',resultadoconfirmresetVTyBFD); 

Answer 8

Musiałem zastosować tłumaczenie do OK i Anuluj. I zmodyfikowany kod, z wyjątkiem dynamicznego tekstu (funkcja nazywa moje tłumaczenie)

---

$.extend({ 
 
    confirm: function(message, title, okAction) { 
 
     $("<div></div>").dialog({ 
 
      // Remove the closing 'X' from the dialog 
 
      open: function(event, ui) { $(".ui-dialog-titlebar-close").hide(); }, 
 
      width: 500, 
 
      buttons: [{ 
 
       text: localizationInstance.translate("Ok"), 
 
       click: function() { 
 
        $(this).dialog("close"); 
 
        okAction(); 
 
       } 
 
      }, 
 
       { 
 
       text: localizationInstance.translate("Cancel"), 
 
       click: function() { 
 
        $(this).dialog("close"); 
 
       } 
 
      }], 
 
      close: function(event, ui) { $(this).remove(); }, 
 
      resizable: false, 
 
      title: title, 
 
      modal: true 
 
     }).text(message); 
 
    } 
 
});