2

関数を作成し、スパン内の 1 秒ごとに 1 から 10 を表示したいと考えました。プログラムをデバッグしているときに、結果をコンソールに記録したかったのですが、Firefox と Chrome で異なる結果が表示されました。Chrome では、ページが更新されるたびに結果が変更されます。

以下は私の機能です：

function log10()  {
        for(var i =0;i<=10;i++)
        {
            console.log(setInterval(function() {
                $("span").text(i)
            },6000));
        }
}

FIREFOX RESULT LOGS: 2 から 11 (firebug 経由) で、リロードしても同じままです。

CHROME SHOWS: 1 から 11 (組み込みのデバッガー経由) そして、リロードするたびに 22 から 22 / 23 から 33 / 34 から 34 などを示します。

経由で関数を呼び出しています<body onload = log10();>

誰が何が起こっているのか知っていますか。私のコードに従ってスパンで1から10をログに記録する方法を知ることにもっと興味があります$("span").text(i)

4

3 に答える 3

3

コンテキストを保存するための匿名関数を使用して、コンテキストを保存していません。(ページを使用するか、ページをアンロードすることによって)停止するまで停止しないため、setTimeoutの代わりに を使用する必要があります。一方、ループごとに 1 回だけ実行され、6000 ミリ秒の遅延があります。jsfiddlesetIntervalsetIntervalclearIntervalsetTimeout

function log10()  {
    var i = 0;
    function repeat(){
        if(i > 10 ) return;
        setTimeout(repeat, 600);
        $("span").text(i);
        i++;
    } 
    repeat();
}
于 2012-10-24T17:42:39.240 に答える
3

http://jsfiddle.net/8sdu5/2/

function log10()  {
    var counter = 1;
    var evt = setInterval(function() {
        $("span").text(counter++);
        if(counter > 10)
            clearInterval(evt);
    }, 1000);
}

ループは必要ありません。setInterval はそれ自体で「ループ」します。いつ停止するかを伝える条件が必要です。

于 2012-10-24T17:51:57.423 に答える
0

変数バインディングの問題が発生しています。それらを解決する別の方法は、表示される数値を再帰と setTimeout と組み合わせて渡すことです。

jsFidle の作業例

// recursive function
function log10(theNumber)  {
        if (theNumber <= 10)
        {
            setTimeout(function() {
                $("span").text(theNumber);
                log10(++theNumber);
            },1000);
        }
}

// kick things off
log10(0);
于 2012-10-24T18:09:59.923 に答える