1

私はポモドーロ タイマーを作成して、Javascript を上手に使えるようにしています。これまでのところ、ユーザーの入力を数分に変えることができましたが、console.log を使用してカウントダウン タイマーを作成できないようです。

警告: ブラウザが壊れているようです。

これは私のフィドルです: http://jsfiddle.net/tmyie/YcBh9/

Javascript:

        var doc = document,
            timer = doc.getElementsByClassName('timer')[0],
            button = doc.getElementsByTagName('button')[0];

        button.onclick = function () {
            var input = doc.getElementById('input').value;
            var speed = (input * 1000) * 60;

            for (i = speed; speed > 1; i - 1000) {

                console.log(i);
            }
        }

HTML:

<div class="timer"></div>I am going to spend
<input id="input"></input>minutes working
<button>Go!</button>
4

3 に答える 3

1

forループを使用しないでくださいsetTimeout。代わりに使用してください。それ以外の場合、ループは、UI を更新してタイマーの進行状況を表示しようとする試みを含め、それ以降のコードとユーザーの操作をブロックします。代わりにこれを試してください：

button.onclick = function () {
    var input = doc.getElementById('input').value;
    var remaining = (input * 1000) * 60;

    function updateTimer() {
        console.log((remaining/1000) + " seconds remaining");
        remaining -= 1000;
        if(remaining > 0) setTimeout(updateTimer, 1000);
    }
    updateTimer();
}

http://jsfiddle.net/YcBh9/1/

于 2013-06-30T18:50:08.083 に答える
1

for ループが適切に減分されず、無限ループが発生します。-=だけでなく、チェックする必要があるときに-チェックしています。speedi

for (i = speed; i > 1; i -= 1000) {
于 2013-06-30T18:43:22.687 に答える