jQuery :: Ajax支持进度条吗？

小编典典

jQuery :: Ajax支持进度条吗？

ajax

我有一个页面，它使用jquery的ajax函数发送一些消息。

最多可能要发送5万条消息。

显然，这可能需要一些时间。

我想要做的是显示带有正在发送的消息的进度条。

后端是PHP。

我怎样才能做到这一点？

我的解决方案：通过原始ajax调用中的唯一标识符发送。
该标识符与完成百分比一起存储在数据库（或以标识符等命名的文件）中。

随着原始脚本的进行更新。

设置一个名为 progress(ident)

该函数对读取百分比的脚本进行ajax调用。
进度条将更新如果返回的百分比不是100，则
该函数设置一个超时，该超时将在1秒后调用。

阅读 338

2020-07-26

共1个答案

小编典典

您可以将动画gif加载通过.html()到结果区域，直到您的ajax函数返回结果为止。只是个主意。

关于jquery ui进度栏，您需要间歇地遍历脚本，并将代表完成百分比的数字值作为已分配的javascript变量进行回显。例如…

// text example php script
if (isset($_GET['twentyfive-percent'])) {
    sleep(2); // I used sleep() to simulate processing
    echo '$("#progressbar").progressbar({ value: 25 });';
    }
if (isset($_GET['fifty-percent'])) {
    sleep(2);
    echo '$("#progressbar").progressbar({ value: 50 });';
    }
if (isset($_GET['seventyfive-percent'])) {
    sleep(2);
    echo '$("#progressbar").progressbar({ value: 75 });';
    }
if (isset($_GET['onehundred-percent'])) {
    sleep(2);
    echo '$("#progressbar").progressbar({ value: 100 });';
    }

下面是我用来获取进度条以更新其位置的函数。我知道，有点疯了。

avail_elem = 0;
function progress_bar() {
    progress_status = $('#progressbar').progressbar('value');
    progress_status_avail = ['twentyfive-percent', 'fifty-percent', 'seventyfive-percent', 'onehundred-percent'];
    if (progress_status != '100') {
        $.ajax({
            url: 'test.php?' + progress_status_avail[avail_elem],
            success: function(msg) {
                eval(msg);
                avail_elem++;
                progress_bar();
                }
            });
        }
    }

如果我不得不猜测的话，我敢打赌，还有更好的方法……但这就是我测试它时对我有用的方法。

2020-07-26