JS之简单计时器及setInterval()用法
setInterval基本用法
time = setInterval(function(
alert("每两秒弹出一次");
), 2000);
clearInterval(time);//关闭
简单计时器
要求：
按钮1(开始、暂停、继续)：
开始按钮：开始计时，按钮变为“暂停”；
暂停按钮：暂停计时，按钮变为“继续”；
继续按钮：继续刚才计时，按钮变为“暂停”；
按钮2：
重置：所有内容清空；
html代码：
<body>
<input type="text" id="hours" value="" />:
<input type="text" id="minute" value="" />:
<input type="text" id="second" value="" /><br />
<button id="btn1">开始</button>
<button id="btn2">重置</button>
</body>
JavaScript代码：
<script type="text/javascript">
onload = function(){
var hour = 0;
var minute = 0;
var second = 0;
var hours = document.getElementById("hours");
var minutes = document.getElementById("minute");
var seconds = document.getElementById("second");
var start = document.getElementById("btn1");
var stop = document.getElementById("btn2");
start.onclick = function(){
alert(start.innerHTML);
if (start.innerHTML == "开始") {
start.innerHTML = "暂停";
time = setInterval(function(){
second++;
if (second >= 60) {
second = 0;
minute +=1;
}
if (minute >= 60) {
minute = 0;
hour += 1;
}
seconds.value = second;
minutes.value = minute;
hours.value = hour;
},200);
} else if(start.innerHTML == "暂停"){
start.innerHTML = "继续";
clearInterval(time);
} else if(start.innerHTML == "继续"){
start.innerHTML = "暂停";
time = setInterval(function(){
second++;
if (second >= 60) {
second = 0;
minute +=1;
}
if (minute >= 60) {
minute = 0;
hour += 1;
}
seconds.value = second;
minutes.value = minute;
hours.value = hour;
},200);
}
}
stop.onclick = function(){
clearInterval(time);
second = 0;
minute = 0;
hour = 0;
seconds.value = "";
minutes.value = "";
hours.value = "";
start.innerHTML = "开始";
}
}
</script>
