for循環中的JavaScript setTimeout函數只發生一次

Question

我有一個forTime循環，裏面有一個setTimeout函數用於延遲循環的每次迭代。雖然循環內的其餘代碼正確迭代，但setTimeout函數只能工作一次，就好像for循環在裏面一樣，而不是相反。這裏是我的代碼：

for (x = 0; x <= roll; x ++) { 
     setTimeout(function() { 
      space = $(".player." + turn).parents("td").attr("id"); 
      space = parseInt(space); 
      player = $(".player." + turn); 
      $(".player." + turn).remove(); 
      nextSpace = space + 1; 
      $("#" + nextSpace).append(player); 
     }, 500); 
    } 

任何想法？

Answer 1

試試這個：

setTimeout(function() { 
    // your code 
}, 500 * x); 

Answer 2

這不是如何setTimeout的作品。這不是同步延遲。如果要延遲循環的每次迭代，則需要通過遞歸調用內部函數來完成此操作。

function inner_function(x, max_x) { 
    space = $(".player." + turn).parents("td").attr("id"); 
    space = parseInt(space); 
    player = $(".player." + turn); 
    $(".player." + turn).remove(); 
    nextSpace = space + 1; 
    $("#" + nextSpace).append(player); 

    setTimeout(inner_function, 500, x+1, max_x); 
} 

inner_function(0, 500);