Question

以下javascript显示最终结果（而不是每秒更新）。如何迭代getJSON调用的结果，显示结果，并延迟直到我显示下一个元素？

function display(state) {
  for (var i=0; i < state.length; i++) {
    $('#someDiv' + i).text(state[i]);
  }
}

$.getJSON('/getdata', function(data) {
  $.each(data, function(key, val) {
    setTimeout(function(){display(val)}, 1000);
  });
}

Answer 1

问题在于，在$.each()循环中，您可以立即对所有超时进行排队，循环后的所有超时都是1000毫秒。解决这个问题的最简单方法如下：

$.getJSON('/getdata', function(data) {
  $.each(data, function(key, val) {
    setTimeout(function(){display(val)}, 1000 * key);
  });
});

注意到只有data是一个数组才有效，因此key是整数索引。如果data是对象且key不是整数索引，则可以执行此操作：

$.getJSON('/getdata', function(data) {
  var i = 0;
  $.each(data, function(key, val) {
    setTimeout(function(){display(val)}, 1000 * i++);
  });
});

（如果您不希望第一次更新立即发生，请将i初始设置为1.）

jquery显示+延迟策略

1 个答案: