不能将函数实现到while循环中吗?

时间:2014-12-20 16:20:07

标签: javascript

function start() {
var work = document.getElementById("work").value;
var rest = document.getElementById("rest").value;
var rounds = document.getElementById("rounds");
var timer = document.getElementById("timer");

function countdown() {
    var roundsValue = rounds.value;
    while (roundsValue > 0) {
        var worktime = setInterval(function () {
            timer.value = work + "sec";
            work = work - 1;
            if (work === 0) {
                clearInterval(worktime);
            }
        }, 1000);

        var resttime = setInterval(function(){
            timer.value = rest + "sec";
            rest = rest-1;
            if(rest === 0){
                clearInterval(resttime);
            }
        }, 1000);  

        roundsValue = roundsValue-1;
    }
}

}

我正在研究我的javascript进度,我来这里遇到了这个问题。我想重复相同数量的工作时间和休息时间,但它不会像这样工作,我不能帮助自己。例如:8轮10秒的工作,然后5秒的休息。它可能不起作用,因为函数不能实现到WHILE循环中。

小提琴:http://jsfiddle.net/shhyq02e/4/

1 个答案:

答案 0 :(得分:0)

这是一个快速解决方案,可能不是最好的解决方法,但会做什么。

http://jsfiddle.net/sahilbatla/shhyq02e/6/

function start() {

    var rounds = document.getElementById("rounds");
    var timer = document.getElementById("timer");
    var roundsValue = parseInt(rounds.value);

    (function countdown() {
        var work = document.getElementById("work").value;
        var rest = document.getElementById("rest").value;
        if (roundsValue > 0) {
            var worktime = setInterval(function () {
                timer.value = work + "sec(work)";
                work = work - 1;
                if (work === 0) {
                    clearInterval(worktime);
                    var resttime = setInterval(function() {
                      timer.value = rest + "sec(rest)";
                      rest = rest - 1;
                      if (rest === 0) {
                        clearInterval(resttime);
                        --roundsValue;
                        countdown();
                      }
                    }, 1000); 
                }
            }, 1000);
        }
    })();
}