Приостановка выполнения в цикле jQuery $ .each для элементов JSON

Question

У меня проблема с jQuery, вызов удаленных данных через JSOND. Я хочу приостановить выполнение между каждым элементом в массиве в наборе данных; Я хочу снять данные и затем сделать паузу на 3 секунды между каждым элементом, чтобы я мог отобразить каждый элемент, прежде чем скрыть его и перейти к следующему.

Вот упрощенная версия того, чего я пытаюсь достичь:

$.getJSON(someURL,function(data) {
   $.each(data.items,function(index,item) {
      setTimeout(function() { alert('found one!'); },3000);
   });
});

Проблема, с которой я столкнулся, состоит в том, что код запускает setTimeout () только через 3 секунды, а затем запускает диалоговое окно alert () для каждого элемента в коллекции. Итак, визуально он проходит через предметы так быстро, что виден только последний из них.

Может кто-нибудь указать, где моя ошибка? Большое спасибо! :)

Answer 1

Проблема в том, что каждый цикл происходит в течение миллисекунд, поэтому в основном все setTimeouts отличаются на 1-2 миллисекунды.

Попробуйте умножить на индекс

setTimeout(function() { alert('found one!'); },3000 * index);

Answer 2

Таким образом, оповещение о первом элементе, ожидание 3 секунды, предупреждение о втором элементе, ожидание 3 секунды и т. Д.

$.getJSON(someURL,function(json){
  function doSomething(data){
    if(data.length>0){
      var curItem=data[0];
      alert('item: '+data[0]);
      setTimeout(function(){
        doSomething(data.splice(1));
      },3000);
    }
  }
  doSomething(json.items);
});

Answer 3

Каждый setTimeout будет срабатывать через 3 секунды после их запуска, а не последовательно.Если вы хотите, чтобы они появлялись последовательно, вам нужно увеличивать это время ожидания для каждой итерации data.items или запускать следующую после каждого запуска.Вот простая доработка.

$.getJSON(someURL,function(data) {
   var delay = 0;
   $.each(data.items,function(index,item) {
      setTimeout(function() { alert('found one!'); }, delay += 3000);
   });
});

Конечно, оповещение будет ждать, пока пользователь отклонит их, поэтому этот пример все равно будет выглядеть странно, так как оповещения накапливаются каждые 3 секунды ...