javascript - 使用 JavaScript 自定义确认对话框

Question

我想创建一个类似于 confirm() 的 JavaScript 函数，它显示一个对话框(一个带有问题和 2 个按钮的 div)并返回 true 如果用户单击“确定”或 false 否则。

是否可以使用 JavaScript/jQuery 但没有插件(例如 jQuery UI 或 Dialog)来做到这一点？因为我正在尝试减小尺寸和往返时间...

我尝试编写这段代码，但我不知道如何让函数“等待”用户点击。

我想以这种方式使用我的函数:

answer=myConfirm("Are you sure?")

通过这种方式，我可以在多个上下文中使用相同的函数，只需更改作为参数传递的问题。这与 confirm() 的行为相同

Answer 1

与其等待用户输入然后从函数返回，在 JavaScript 中更常见的是提供一个回调函数，当您等待的操作完成时将调用该函数。例如:

myCustomConfirm("Are you sure?", function (confirmed) {
    if (confirmed) {
        // Whatever you need to do if they clicked confirm
    } else {
        // Whatever you need to do if they clicked cancel
    }
});

这可以按照以下方式实现:

function myCustomConfirm(message, callback) {
    var confirmButton, cancelButton;

    // Create user interface, display message, etc.

    confirmButton.onclick = function() { callback(true); };
    cancelButton.onclick = function() { callback(false); };
}