2

こんにちは、setInterval を setTimeout 関数に変更できますか。問題なく動作しています。setTimeout で実行できるかどうかを知りたいです

<head>
<script type="text/javascript">
$(function() {
    var current = $('#counter').text();
    var endvalue = 50
    $('a').click(function() {
        setInterval(function() {
            if (current === endvalue) {

            } else {
                current++;
                $('#counter').text(current)
            }
        }, 50)
    })
})
</script>
</head>
<body>
<div id="counter">0</div>
<a href="#">Click</a>
</body>
4

4 に答える 4

1

関数を使用してsetTimeoutを含め、関数内で呼び出します

$(function() {
    var current = $('#counter').text();
    var endvalue = 50;

    function timeoutVersion() {
        if (current === endvalue) {return false;} else {
            current++;
            $('#counter').text(current);
        }
        setTimeout(timeoutVersion, 50);
    }

    $('a').click(function() {
        timeoutVersion();
    })
})​

ライブデモ| ソース

setIntervalただし、終了後にwithをクリアする方がはるかに優れてclearIntervalいます。

$(function() {
    var current = $('#counter').text();
    var endvalue = 50
    $('a').click(function() {
        var storedInterval = setInterval(function() {
            if (current === endvalue) {
                clearInterval(storedInterval);
            } else {
                current++;
                $('#counter').text(current)
            }
        }, 50)
    })
})​

ライブデモ| ソース


あなたの質問に答えるには - はい、使用したコードにいくつかの小さな変更を加えて変更setIntervalできますsetTimeoutsetInterval

于 2012-12-24T14:32:28.870 に答える
0

たとえば、1 秒に等しい 1000 ミリ秒ごとに関数を実行するために使用setInterval()すると、関数の実行にどれだけ時間がかかっても、関数は 1000 ミリ秒ごとにトリガーされますsetTimeout()。たとえば、関数の実行に 500 ミリ秒かかっていた場合、関数の実行間の合計時間ギャップは 1500 ミリ秒になります。

于 2012-12-24T14:40:43.743 に答える
0

はい、setTimeout を使用して同じ関数を再帰的に呼び出して、setInterval の効果を得ることができます。setTimeout では、再帰的に使用する場合、ループを停止するために手動でチェックする必要があることに注意してください。ただし、setInterval 関数は ID を返します。この ID を使用して clearInterval 関数を呼び出し、必要に応じていつでも停止できます。

于 2012-12-24T14:41:41.357 に答える
0

ボビンスによってよりよく説明されている理由で、私は常にsetTimeoutオーバーをお勧めします。より簡単なアプローチは、目標に到達したら次のタイムアウトを呼び出さないことですsetInterval

ライブデモ

 $(function() {
    var current = $('#counter').text();
    var endvalue = 50;

    function increment() {
        if (current !== endvalue) {
            current++;
            $('#counter').text(current)
            setTimeout(increment, 50);
        }

    }

    $('a').click(function() {
        increment();
    })
})​;
于 2012-12-24T14:44:20.093 に答える