在$each函数中操作元素的文本

Question

我试图为用户显示$each循环中对象的传递情况（以百分比为单位）。在控制台中，我看到了正确的值，但在前端，只有在执行$each循环之后才显示项目的内容，然后显示100%。

var count   = 1;
var loading = 0;
var rows    = Object.keys(aData[0]).length;
$.each(aData[0], function(key, value) {
   loading = Math.round((count*100)/rows);
   count++;
   console.log(loading + '%');
   $('#editForm-loader i.info').text(loading + '%');
});

Answer 1

您可以使用setTimeout()并在循环的每次迭代中增加延迟。

简化示例：

null

const data = [10, 30, 50, 70, 90, 100]

$.each(data, function(i, value) {
  setTimeout(function() {    
    $('#editForm-loader i.info').text(value + '%');
  }, i * 500)// 1/2 second increments
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<p id="editForm-loader"><i class="info"></i></p>