Ожидание завершения цикла итерации цикла должно быть завершено визуально, прежде чем переходить на следующий.

Question

function start_map_one() { 

for (var i = 0; i < 15; ++i) { 
     $.when(update_map()).then(evolve('W','W1',18,2,sea_limitations,20,350)); 
} 
} 

здесь, update_map() обновляет div. Однако вместо того, чтобы обновлять div визуально 15 раз подряд, он, кажется, ждет, пока все 15 итераций не будут завершены, а затем отобразится готовый div.

Так им ищет для этого заказа в идеале:

update_map() картографической информации используется для обновления DIV - пользователь видит визуальный результат ... потом ...

эволюционируют() картографической информации обновляется за кулисами

update_map() информационная карта используется для обновления DIV - пользователь видит визуальный результат ... потом ...

эволюционируют() м ар информация обновляется за кулисами

и т.д. и т.д. 15 раз

Answer 1

Рассмотрите возможность использования рекурсии для этого. Не зная, слишком много о том, что делает код, он может выглядеть примерно так ...

function start_map_one() { 
    start_map_one_helper(15); 
} 

function start_map_one_helper(count) { 
    if (count <= 0) { 
     return; 
    } 
    $.when(update_map()).then(function() { 
     evolve('W','W1',18,2,sea_limitations,20,350); 
     start_map_one_helper(count - 1); 
    }); 
} 

Обратите внимание, что then() обратного вызова должен быть обернут в функции, в противном случае он выполняет сразу.

Вам может понадобиться, чтобы обернуть рекурсивный вызов в SetTimeout, чтобы увидеть изменения на экране ...

function start_map_one() { 
    start_map_one_helper(15); 
} 

function start_map_one_helper(count) { 
    if (count <= 0) { 
     return; 
    } 
    $.when(update_map()).then(function() { 
     evolve('W','W1',18,2,sea_limitations,20,350); 
     setTimeout(function() { 
      start_map_one_helper(count - 1); 
     }); 
    }); 
} 

Answer 2

Это потому, что вы не дать браузеру достаточно времени, чтобы изменить отображение. Просто добавьте задержку между выполнением каждой итерации. Попробуйте это решение

function start_map_one() { 
    for (var i = 0; i < 15; ++i) { 
     setTimeout(function() { 
      $.when(update_map()).then(evolve('W','W1',18,2,sea_limitations,20,350)); 
     }, i * 100); 
    } 
} 

Измените подходящее по времени 100.

Кроме того, вы не герметизирующего функцию эволюционировать (что означает, что вы звоните эволюционировать во время цикла вместо вызова через то. Просто оберните его в функцию.