0

この問題が以前に尋ねられたのを見たことがありますが、私が試したすべての提案と、自分でのいくつかの実験は失敗しました。

Javascript を使用して次のコードを実行すると、テキストエリアには i (5) の最後の値のみが表示されます。コメントアウトされたアラートを使用すると、機能します。

タイムアウト、インターバル、日付と時刻の遅延、さらにはループを使用して処理を遅らせようとしましたが、コメントアウトされていないときに以下のコードで使用されているアラートを使用しない限り、何も機能しません。多少の遅延があっても、処理を続行できることは承知しています。関数を終了した後、テキストエリアに最後の値が表示されるように見えるため、変数を他の関数に渡してそこからテキストエリアに表示しようとしました。

1 から 5 までの数字が一度に 1 つずつ表示されるように、各反復でテキストエリアを更新する方法を教えてください。

そして、アクションを一時停止する他の方法では機能しないのに、なぜアラートが機能するのか興味があります。

ありがとう。

function Go(){
  var i = 0;
  for(i=0; i<6; i++){
    alert("This allows textarea to update with each iteration");
    document.getElementById("ta").value = "";
    document.getElementById("ta").value = i;
  }
}

<textarea id="ta" name="display" rows="15" cols="50"></textarea>
<br /><INPUT TYPE="button" VALUE="START" onClick="Go()">
4

5 に答える 5

1

再帰を使用した別の例を次に示します。

function Go(counter){    
    if (counter > 5){
       return;
    } else {
       document.getElementById("ta").value = counter;
       window.setTimeout(function(){ Go(++counter) }, 500);
    }
};

Go(1);

関数をコールバックとしてタイマーに渡した場合、タイマーは指定された期間待機してから関数を実行します。これは、遅延なしですべての反復を実行します。数の増加を確認するには、関数呼び出し (または反復) の間で待機する必要があります。それが役立つことを願っています:)

于 2013-07-15T20:08:10.750 に答える
0

スコープとを使用した例を次に示します。setTimeout

function Go(){
    var i = 0,
        fn = function () {
            if (i >= 6) return;
            document.getElementById("ta").value = i;
            ++i;
            window.setTimeout(fn, 500);
        };
    fn();
}
于 2013-07-15T20:02:22.823 に答える
0 
Thanks for all your answers. I should have checked in earlier.  Spent all day on this.
I'm new at Javascript and did come up with something that works on my own but it ain't
pretty. I want to learn to use Javascript correctly so I'll look over your  
responses and compare. Seems I should be able to consolidate the functions I came up 
with below or just learn from your suggestions posted here.  I guess I should become 
familiar with jquery, Ajax, etc. as I saw that used a lot in my searching for an 
answer.

<body>
<textarea id="ta" name="testinput" rows="15" cols="50"></textarea>
</body>

<script language="javascript" type="text/javascript">

var i = 0;
document.getElementById('ta').innerHTML = i;
setTimeout(Test1, 3000); 

function Test1(){

  i++;
  document.getElementById('ta').innerHTML = i;
  if(i<4){ //TEXTAREA WILL STOP AT 5
    setTimeout(Test2, 3000);
  }
}

function Test2(){

  i++;
  document.getElementById('ta').innerHTML = i;
  setTimeout(Test1, 3000); 
}

</script>
于 2013-07-16T05:28:19.663 に答える