javascript - jqueryで5秒ごとに部門の値を置き換える方法は?

Question

5 秒ごとにdividの値を新しい値に置き換えたい。show_num_valそのために、次のように書いています。

<div id="show_num_val"> 0 </div>

スクリプト内:

 <script>
 $(document).ready(function() {      
  for(i=0;i<20;i++){
    showThis(i);
  }      
});

function showThis(x) {
  setTimeout(function() {
   $('#show_num_val').html(x);
  }, 5000);
 }
</script>

しかし、最後の値、つまりdiv20でのみ取得しています。show_num_val誰でも助けることができますか？

Answer 1

繰り返し実行する場合は、 setInterval()を使用できます。

ライブデモ

$(document).ready(function() {  
    x = 1;
    inverval = setInterval(function() {
                $('#show_num_val').html(x++);
                if(x == 21)
                     clearInterval(inverval);
               }, 2000);​

});

Answer 2

var x = 0;
T = setInterval(function() {
  if (x == 20) clearInterval(T);
  $('#show_num_val').html(x); 
  x++;
}, 5000);

Answer 3

http://jsbin.com/ajekeq/2/watch の動作を確認してください

  <script>
   $(document).ready(function() {      
    for(i=1; i<20; i++){
      showThis(i, 5000 * i));
    }      
  });

  function showThis(x, y) {
    setTimeout(function() {
     $('#show_num_val').html(x);
    }, y);
   }
  </script>

すべてのタイマーが同時に終了したため、コードが機能しなかった理由。同時に20個のタイマーを開始しているので、setIntervalを使用したかったのですが。もう 1 つのモデルは、完了するまで setTimeout 呼び出しで次のタイマーを開始することです。