Question

我将所有alert扩展为像这样的fancybox

window.alert = function(message){
    $("#alert_message_box .warmsg span").html(message);
    $.fancybox({'href':'#alert_message_box'});
    return false;
}

并且工作正常。我还尝试扩展confirm框

 window.confirm = function(message){
    $("#confirm_message_box .warmsg span").html(message);
    $.fancybox({'href':'#confirm_message_box'});
}

confirm_message_box div包含两个按钮，Yes和No。

if(confirm(alert_msg)){ } 在这种情况下，如何调用confirm函数以及如何将true和false返回到被调用函数

我不知道是否有任何问题覆盖这些功能。

这是一个带jquery的jsfiddle演示（此处未使用fancybox）

http://jsfiddle.net/fzTa3/

Answer 1

在这种情况下，您必须更改工作流程，因为Fancybox版本的confirm不是模态对话框（它不会暂停脚本执行）。您必须在相应的按钮点击时使用回调：

window.confirm = function(message, onYes, onNo) {
    $("#confirm_message_box .warmsg span").html(message);
    $.fancybox({
        href: '#confirm_message_box'
        afterLoad: function() {
            this.inner.find('.btn-yes').click(onYes);
            this.inner.find('.btn-no').click(onNo);
        }
    });
}

您需要在您的fancybox初始化中将onYes函数绑定到是按钮并将onNo绑定到否。

用法如下：

confirm('Are you sure?', function() {
    // he is sure
}, function() {
    // cancel something
});

Answer 2

不同意@dfsq's answer但我发现Yes，No回调方法过于严格，而我自己找到了一种更灵活的方法来解决这个问题。

示例用法：

confirm("Do you wish to continue?", 
    {
        /* 
        Define your buttons here, can handle multiple buttons 
        with custom title and values
        */
        buttons: [
            { class: "yes", type: "button", title: "Yes", value: "yes" },
            { class: "no", type: "button", title: "No", value: "no" },
            { class: "maybe", type: "button", title: "Maybe?", value: "maybe" }
        ],
        modal: true
    }, 
    function(resp) {
        alert("You clicked " + resp);
    }
);

Answer to Javascript/Jquery Callback for Fancybox Yes No Confirm
经典是，否 - jsfiddle
不太通用的例子 jsfiddle

用fancybox扩展Javascript Confirm Box

2 个答案: