在JavaScript中为间隔计时器循环

问题描述

im试图在javascript中创建一个带有2个计时器（努力和休息）的间隔计时码表，一切都用计时码表启动，暂停，重置按钮，问题是我希望计数结束时计数自动重复，我尝试了很多类似添加“ for / while”代码的操作，但是它不起作用，感谢您的任何帮助，这样可以节省我。

//Selectors
const timerText = document.getElementById("timer-text");
const btnPause = document.getElementById("btn-pause");
const btnReset = document.getElementById("btn-reset");
let count;
let input = document.getElementById("user-input"); // on attribue la variable timer l'entrée
let input2 = document.getElementById("user-input2");
let number = document.getElementById("user-input3");
var results = document.getElementById("results");
var word = document.getElementById("word");
let countDownSeconds;

let timer1 = document.getElementById("timerEffort");
let timer2 = document.getElementById("timerRepos");

let timersCount = 0;

//Event Listeners
btnPause.addEventListener('click',function () {
    clearInterval(count);
});
btnReset.addEventListener('click',function () {
    location.reload(count);
})
//Functions
function startTime() {
    count = setInterval(start,1000);
    document.getElementById("timerEffort").innerHTML = input.value;
    countDownSeconds = input.value;
}
function start() {
    countDownSeconds--;
    document.getElementById("timerEffort").innerHTML = countDownSeconds;
    if (countDownSeconds == -1) {
        clearInterval(count);
        document.getElementById("timerEffort").innerHTML = "0";
        document.getElementById("timerRepos").innerHTML = input2.value;
        countDownSeconds = input2.value;
        count = setInterval(start2,1000);
    }
}
function start2() {
    countDownSeconds--;
    document.getElementById("timerRepos").innerHTML = countDownSeconds;
    if (countDownSeconds == -1) {
        clearInterval(count);
        document.getElementById("timerRepos").innerHTML = "0";
    }
}

<link href='https://fonts.googleapis.com/css?family=Poppins' rel='stylesheet'>

<div class="container">
    <div class="header">
        <h1>Interval Timer</h1>
    </div>
    <div class="section">
        <div class="informations">
            <h3>Effort :</h3>
            <h2 id="timerEffort"><br>0</h2>
            <h3>Repos :</h3>
            <h2 id="timerRepos"><br>0</h2>
        </div>
        <input type="number" min="0" id="user-input" placeholder="input the duration of Effort"></input>
        <input type="number" min="0" id="user-input2" placeholder="Input the duration of Rest"></input>
        number of loop :<div id="totalcounter">1</div>
        <button onclick="startTime()" id="btn-start">Go&nbsp;</button>
        <button id="btn-pause">Pause&nbsp;</button>
        <button id="btn-reset">Reset&nbsp;</button>
    </div>
</div>

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）