<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<div>倒计时<span style="color:red;font-size:50px;" id="time"></span></div>
<button id="star">点击开始</button>
<button id="stop">点击停止</button>
<script>
window.onload=function(){
op();
var st = setInterval(op,500);
var stop =document.getElementById('stop');
var star =document.getElementById('star');
stop.onclick=stp;
star.onclick=sta;
function sta(){
setInterval(op,500);
}
function stp(){
clearInterval(st);
}
}
function op(){
var time = document.getElementById('time');
var now = new Date();
var end = new Date('2018/05/20,5:20');
var s =parseInt((end.getTime() - now.getTime())/1000); //总共秒数
var ss =parseInt(s%60);
var m =parseInt(s/60%60);
var h =parseInt(s/(60*60)%24);
var d =parseInt(s/(24*60*60));
ss = check(ss);
m=check(m);
time.innerHTML=d+"天"+h+"小时"+m+'分'+ss+'秒';
if(s<=0){
time.innerHTML='时间结束啦，没有啦0.0！'
}
}
function check(i){
if(i<10){
i='0'+i;
}
return i;
}
</script>
</body>
</html>
3 回答
已采纳
MarlboroKay
TA贡献189条经验 获得超236个赞
首先，因为你在加载的时候定义了 st ，所以当你第一次点击停止的时候，st 会被清除掉。但是第二次点击时，加载的st 一直被调用，所以导致停止不好使。
1、把加载的 st 注释掉 2、在 sta 方法里定义一个全局变量 st
//var st=setInterval(op,500);
function sta(){
//setInterval(op,500);
st = setInterval(op,500);
}
function stp(){
//console.log(st)
clearInterval(st);
}
这样写只是解决了问题，但是会产生 全局变量，个人不建议这么做。
其实可以把 star stop 写在一个方法里，用参数值来做判断。
希望对你有帮助，望采纳！
添加回答
举报
0/150
提交
取消