jQuery 获取将 json 加载到数组中的百分比

Question

我在客户端有这段代码读取 json 文件：

/* PLAYLIST - total */
var total = 372 / Object.keys(res).length;

$.each(res, function(key, item) {
    $(".loader_bar").css("width", (total*key)+"px");
})

然后我的进度条填充到 100% (372px) 但我没有看到填充进度条的任何进度...所以我想我需要一些计时器或什么元素来计算阅读时的百分比 json来自从服务器接收的 res 对象，当读取 res 对象以更新进度条时...例如，我有 res.length 的 3 个项目，所以我的进度条需要这样：

0%
33%
66%
100%

但是我只看到进度条在等待了很短的时间（例如 10 秒）后从 0% 变为 100% 而没有其他值...那么我如何才能每秒存档一次进度更新，以便我可以在 $.each function?

中看到每秒或从 json 读取的每个项目更新的进度

谢谢。

Answer 1

问题是你的循环太快了。试试这个：

$.each(res, function(key, item) {
   setTimeout(function(){
      $(".loader_bar").css("width", (total*key)+"px");
   }, 200);
});

玩一下延迟，看看是否有预期的效果。

或者使用插件。

jQuery 获取将 json 加载到数组中的百分比

jQuery get percetage of loading json into array

jquery

json

progress