Бесконечный прогрессбар с JS Toastr

Можно ли сделать уведомление с помощью ProgressBar, которое будет длиться вечно, или пока я не отключу его вручную в коде?

Я хочу показать это при сохранении данных ajax и не знаю, сколько времени это займет.

2 ответа

Для этого вы можете использовать поддельное время, чтобы указать прогресс; как все мы знаем, запрос ajax может занять ок. 30сек;

Мы можем создать функцию показа фальшивого индикатора выполнения в течение 30 секунд;

Если мы получим ответ до 30 сек. мы установим прогресс на 100%, какой бы он ни был сейчас, и покажем ответ пользователю;

Иначе, если запрос не завершен в течение 30 секунд; мы можем установить прогресс до 99% и ждать ответа от сервера, а когда мы получим ответ, мы установим его на 100% и покажем ответ пользователю;:)

Да, это возможно.

Вы должны использовать веб-работники HTML5 API для этого с плагином тостера.

Пример использования плагина тостера навсегда приведен здесь.


Демо - версия 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);
}});

Для обновления данных с сервера.

Другие вопросы по тегам