带有js toastr的无限进度条答案

【问题标题】：Infinite progressbar with js toastr带有js toastr的无限进度条
【发布时间】：2016-03-14 07:30:50
【问题描述】：

是否可以使用 ProgressBar 发出一个 toastr 通知，该通知将永远持续或直到我在代码中手动禁用它？

我想在 ajax 数据保存上显示它，我不知道需要多少时间。

【问题讨论】：

我看到我之前的答案已经被删除了，尽管上面的答案并不酷且错误。正如 TFerrel 在其他线程 stackoverflow.com/questions/30403632/… 中所述“目前无法显示不确定的进度。”
好的，我明白你的问题了。我在 2 个地方回答

标签： javascript toastr

【解决方案1】：

是的，有可能。

您应该使用 web-workers HTML5 API 与烤面包机插件一起执行此操作。

here 给出了一个永远使用烤面包机插件的例子。

demo web-workers HTML5 API 演示在这里：

var w;

function startWorker() {
    if(typeof(Worker) !== "undefined") {
        if(typeof(w) == "undefined") {
            w = new Worker("demo_workers.js");
        }
        w.onmessage = function(event) {
            document.getElementById("result").innerHTML = event.data;
        };
    } else {
        document.getElementById("result").innerHTML = "Sorry, your browser does not support Web Workers...";
    }
}

function stopWorker() { 
    w.terminate();
    w = undefined;
}

<p>Count numbers: <output id="result"></output></p>
<button onclick="startWorker()">Start Worker</button> 
<button onclick="stopWorker()">Stop Worker</button>
<p><strong>Note:</strong> Internet Explorer 9 and earlier versions do not support Web Workers.</p>

您应该在startWorker() 函数中定义您的工作。

您也可以使用 AJAX 来更新数据 :) 像这样-

$.ajax({url: "demo_test.txt", success: function(result){
    $("#div1").html(result);
}});

用于从服务器更新数据。

【讨论】：

【解决方案2】：

为此，您可以使用假时间来指示进度；正如我们所知，一个ajax请求可能需要大约。 30秒；

我们可以创建一个函数来显示 30 秒的假进度条；

如果我们在 30 秒前收到回复。我们将进度设置为 100%，无论现在如何，都会向用户显示响应；

如果请求未在 30 秒内完成，则为其他；我们可以将进度设置为 99% 并等待来自服务器的响应，当我们收到响应时，我们会将其设置为 100% 并向用户显示响应； :)

【讨论】：