Question

我已经编辑了默认的alert()函数，如下所示：

window.alert = function(str){
    //custom alert
}

基本上，新功能将显示HTML <div>模式。

背景故事：

我想回答这个问题，因为我遇到了问题。警报被隐藏，并在调用自定义警报功能时显示。因此，自定义警报基本上显示元素并更改其文本。 因此，当我有多个alert()来电时，只显示最后一条消息！：（

但是，与默认警报框不同。它当然不会暂停网页，直到警报消失，就像默认的alert()功能一样。

是否可以模仿“暂停网页”行为？

此外，还有另外一种方法，然后使用setTimeout()检查isCustomAlertOpen == true是否延迟另一个自定义提醒，直到当前提醒被解除？

编辑：

有没有办法排队自定义提醒？

我不介意jQuery，但我认为它可能在这里被制服了。

我的问题标题很糟糕。有人可以为我想一个更好的头衔吗？

Answer 1

是否有可能模仿这种“暂停网页”行为？

答案是否定的。有办法阻止ui（同步ajax调用，长循环等）。但是当用户单击“确定”按钮时，您将无法停止这些操作。

更好的方法是重构代码，使其不会同步运行。也就是说，在等待用户时你不需要阻止ui。

此外，还有另一种方法，然后使用setTimeout（）来检查isCustomAlertOpen ==是否延迟另一个自定义警报，直到当前警报被解除为止？

这样做的一种方法是：不是在一个地方设置标志，而是在另一个地方重复检查。您可以使用事件的概念。代码的一部分是等待触发事件而另一部分触发它。 jQuery中有一个库可以为你做这个，或者你可以阅读它并自己编写。

Answer 2

没有办法阻止执行，因为JavaScript是异步的（显然除了3个模态函数和XmlHttpRequest之外）。

出于同样的原因，您无法等待先前的警报关闭，但您可以使用此模式使用事件创建一堆警报：

window.alert = (function() {
    var stack = [];

    var showNextAlert = function() {
        var div = document.createElement("div");
        /* Here, configure the div, show the string from stack[0] and add it to the document ... */
        var okButton = /* ... */;

        okButton.addEventListener("click", function() {
            div.parentNode.removeChild(div);

            stack = stack.slice(1);

            if(stack.length > 0) {
                showNextAlert();
            }
        });
    }

    return function(msg) {
        stack.push(msg);

        if(stack.length == 1) {
            // Show it immediately if the stack is empty
            showNextAlert();
        }
    };
})();

您还应该为此功能使用其他名称，而不是更改本机属性（此处为window.alert）。

JS - 暂停自定义提醒（）

编辑：

2 个答案: