可以jQuery点击事件组合回调

Question

我想显示一个带有OK按钮的确认弹出窗口。通常，如果我不想回调，那么OK按钮将隐藏弹出窗口和图层掩码。当我回调时，单击"确定"按钮将在回调函数中执行某些操作。

function displayErrorPopup(message, callback) {
$("#error_popup_message").html(message);
display_popup($("#error_popup"));
if (callback && typeof (callback) === "function") {
    $("#error_popup_ok").click(function() {
        callback();
    });
} else {
    $("#error_popup_ok").click(function() {
        hideErrorPopup();
    });
}}

但回调函数在调用时立即运行

displayErrorPopup('error message', function(){
do something;
hideErrorPopup();});

没有OK按钮事件点击。

请帮帮我！！感谢

Answer 1

function displayErrorPopup(message, callback) {
    $("#error_popup_message").html(message);
    display_popup($("#error_popup"));
    $("#error_popup_ok").click(function() {
        if (typeof callback == "function") {
            callback();
        } else {
            hideErrorPopup();
        }
    });
}

更简单的方法是：

function displayErrorPopup(message, callback) {
    $("#error_popup_message").html(message);
    display_popup($("#error_popup"));
    $("#error_popup_ok").click(typeof callback == "function" ? callback : hideErrorPopup);
}

Answer 2

根据您的评论创建了一个fancybox警报小提琴。这是链接jsfiddle引用它。

function fancyConfirm(msg,callback) {
var ret;
jQuery.fancybox({
    modal: true,
    content: "<h3>Confirmation:</h3><br/><div style="margin:1px;width:340px;">"+msg+"<div style="text-align:right;margin-top:10px;"><input id="fancyConfirm_cancel" style="margin:3px;padding:0px;height:30px;width:80px;" class="greenbtn" type="button" value="Cancel"><input id="fancyConfirm_ok" style="margin:3px;padding:0px;height:30px;width:80px;" class="greenbtn" type="button" value="Ok"></div></div>",
    afterShow: function() {
        $("#fancyConfirm_cancel").click(function() {
            ret = false;
            jQuery.fancybox.close();
        });
        $("#fancyConfirm_ok").click(function() {
            ret = true;                  
            jQuery.fancybox.close();
        });
    },
    afterClose: function() {
        callback.call(this,ret);
    }
});
}

function fancyConfirmAlert() {
   fancyConfirm("Are you sure you want to perform action.<br/><br/>",  function(ret) {
     alert('done + return values is -> ' + ret);
   });
 }
fancyConfirmAlert() ;