Ya atau Tidak kotak konfirmasi menggunakan jQuery

Saya ingin peringatan ya / Tidak menggunakan jQuery, alih-alih tombol ok / Batal:

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

Ada alternatif lain?

Metode peringatan memblokir eksekusi sampai pengguna menutupnya:

gunakan fungsi konfirmasi:

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

Saya telah menggunakan kode-kode ini:

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>

Kode-kode ini berfungsi untuk saya, tetapi saya tidak begitu yakin apakah ini benar. Bagaimana menurut anda?

Lihat plugin jQuery ini: jquery.confirm .

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

lalu:

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

Ini akan menampilkan popup konfirmasi sebelum melanjutkan untuk mengikuti tautan.

Ada demo di sini: http://myclabs.github.com/jquery.confirm/

Semua contoh yang saya lihat tidak dapat digunakan kembali untuk pertanyaan jenis "ya / tidak" yang berbeda. Saya sedang mencari sesuatu yang memungkinkan saya untuk menentukan panggilan balik sehingga saya dapat menelepon untuk situasi apa pun.

Berikut ini bekerja dengan baik untuk saya:

$.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");
}
});

Saya kemudian menyebutnya seperti ini:

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

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

Saya mengalami kesulitan mendapatkan jawaban kembali dari kotak dialog tetapi akhirnya muncul dengan solusi dengan menggabungkan jawaban dari pertanyaan lain ini display-yes-and-no-buttons-bukannya-of-ok-and-cancel-in-confirm- kotak dengan bagian dari kode dari dialog konfirmasi modal

Inilah yang disarankan untuk pertanyaan lain:

Buat kotak konfirmasi Anda sendiri:

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

Buat confirm()metode Anda sendiri :

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();
}

Sebut dengan kode Anda:

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

PERUBAHAN SAYA Saya telah mengubah cara di atas sehingga alih-alih menelepon, confirmBox.show() saya menggunakan confirmBox.dialog({...}) seperti ini

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();
          }
        }
    });

Perubahan lain yang saya buat adalah membuat div confirmBox dalam fungsi doConfirm, seperti yang dilakukan ThulasiRam dalam jawabannya.

Saya perlu menerapkan terjemahan ke tombol Ok dan Batal. Saya mengubah kode menjadi kecuali teks dinamis (memanggil fungsi terjemahan saya)

$.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);
    }
});

Coba Ini ... Sangat sederhana, cukup gunakan kotak dialog konfirmasi untuk peringatan dengan YES | NO.

if (konfirmasi ("Apakah Anda ingin meningkatkan?")) {Kode Anda}

Anda dapat menggunakan kembali konfirmasi Anda:

    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);