Question

我正在尝试创建一个类似window.confirm的函数，可以像这样使用：

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

我正在写这样的弹出功能：

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*/ });

  }

};

但问题是我无法从I.confirmDialog.open()返回真或假。执行I.confirmDialog.open()功能并不等待按钮点击，点击回调的返回不会影响I.confirmDialog.open()的返回值。

我想知道如果可能的话，如何编写window.confirm

Answer 1

你在这里遇到的问题是被操作的模式是有效的异步（因为你必须等待用户输入），所以你不能.file-area .file-dummy { width: 450px; }任何东西。

相反，为方法提供一些回调函数，可以在所需的事件中调用：

return

然后你会这样称呼它：

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

创建一个像window.confirm这样的函数，它根据按钮点击返回true或false

1 个答案: