用html做秒表但是无法暂停，找不到自己的问题在哪，求指点~~
代码如下：
<html>
<head>
<style>
#t
{ font-size:50px;
width:800px;
color:#223366;
height:280px;
border:3px solid blue;
text-align:center;
margin:10px auto;
padding-top:20px;
text-shadow: 5px 5px 5px #333333;
}
</style>
</head>
<body>
<!--div要放在js前面，否则会找不到目标id-->
<div id="t"></div>
<button type="button" id="start" onclick="start()">开始计时</button>
<button type="button" id="pause" onclick="pause()">暂停</button>
<button type="button" id="clear" onclick="stop()">清空</button>
<script>
var ms=00;
var s=00;
var m=00;
var h=00;
var t=document.getElementById("t");
function clock()
{ms+=10
if(ms>=1000)
{s+=1;
ms-=1000;
}
if(s>=60)
{m+=1;
s-=60;
}
if (m>=60)
{h+=1;
m-=60;
}
ms_=""+ms;
s_=s;
m_=m;
h_=h;
if(s_<10)
{s_="0"+s_;}
if(m_<10)
{m_="0"+m_;}
if(h_<10)
{h_="0"+h_;}
text=h_+"："+m_+"："+s_+" ："+ms_[0]+ms_[1]+"<br>";
t.innerHTML=text;
}
function start()
{setInterval("clock()",10);}
function pause()
{clearInterval("clock()");
var time=document.createElement("span");
time.innerHTML=t.innerHTML+"<br>";
var object=t.appendChild(time);
}
function stop()
{clearInterval("clock()");
var stop=document.getElementsByTagName("span");
for(var i=0;i<stop.length;i++){
var object=t.removeChild(stop[i]);}
ms=00;
s=00;
m=00;
h=00;
text=h +"："+m+"："+s+" ："+ms_[0]+ms_[1]+"<br>";
t.innerHTML=text;}
</script>
</body>
</html>start（）和clock（）没问题，应该就是pause（）中的clearInterval（）没执行，但是不知道为什么orz
感谢！
开始定时器和清除定时器都错了
//开始定时器
var inter = null;
inter=setInterval("clock()",1000);
//清除定时器
clearInterval(inter);
要定义一个全局变量；
var timer1; //放在函数外面，更改下面2行代码。
timer1 = setInterval("clock()",10);
clearInterval(timer1 );
<script>
var ms=00;
var s=00;
var m=00;
var h=00;
var t=document.getElementById("t");
function clock()
{ms+=10
if(ms>=1000)
{s+=1;
ms-=1000;
}
if(s>=60)
{m+=1;
s-=60;
}
if (m>=60)
{h+=1;
m-=60;
}
ms_=""+ms;
s_=s;
m_=m;
h_=h;
if(s_<10)
{s_="0"+s_;}
if(m_<10)
{m_="0"+m_;}
if(h_<10)
{h_="0"+h_;}
text=h_+"："+m_+"："+s_+" ："+ms_[0]+ms_[1]+"<br>";
t.innerHTML=text;
}
var inter=null;
function start()
{inter=setInterval("clock()",10);}
function pause()
{clearInterval(inter);
var time=document.createElement("span");
time.innerHTML=t.innerHTML+"<br>";
var object=t.appendChild(time);
}
function stop()
{clearInterval(inter);
var stop=document.getElementsByTagName("span");
for(var i=0;i<stop.length;i++){
var object=t.removeChild(stop[i]);}
ms=00;
s=00;
m=00;
h=00;
text=h +"："+m+"："+s+" ："+ms_[0]+ms_[1]+"<br>";
t.innerHTML=text;}
</script>帮你改好了，把Script标签的内容替换一下即可
通过题主的代码分析看出，题主主要对定时器开启和取消的语法没掌握
下面给题主说下定时器用法
开启定时器
function f() {
// 逻辑
}
var timer = setInterval(f,时间);
为了将来取消该定时器，一定要用变量接受一下，并且这个变量的声明放函数外，这样其他函数内就可以使用
关闭定时器
clearInterval(timer),里面写上面的变量
计时器的容器要和记录的分开，因为你计时器容器和记录使用同一个容器了，启动计时器是设置容器的内容后清空了之前的记录值，下面的可以了
还有计时器代码会出现undefined内容跳动的问题，一起修正了。其实开始结束使用一个按钮就行了
帮助到你可以点击采纳支持下哦，谢谢~~
<html>
<head>
<style>
#t {
font-size: 50px;
width: 800px;
color: #223366;
height: 280px;
border: 3px solid blue;
text-align: center;
margin: 10px auto;
padding-top: 20px;
text-shadow: 5px 5px 5px #333333;
}
</style>
</head>
<body>
<!--div要放在js前面，否则会找不到目标id-->
<div id="t">
<div id="tick"></div>
</div>
<div style="text-align:center">
<button type="button" id="start" onclick="start(this)">开始计时</button>
<!--<button type="button" id="pause" onclick="pause()">暂停</button>-->
<button type="button" id="clear" onclick="stop()">清空</button>
</div>
<script>
var ms = 00;
var s = 00;
var m = 00;
var h = 00;
var t = document.getElementById("t");
var tick = document.getElementById('tick')
function clock() {
ms += 10
if (ms >= 1000) {
s += 1;
ms -= 1000;
}
if (s >= 60) {
m += 1;
s -= 60;
}
if (m >= 60) {
h += 1;
m -= 60;
}
ms_ = "" + ms;
if (ms_.length < 2) ms_ += '0';//有可能出现1位数字的情况，下面的代码取值会出现undefined导致跳动
s_ = s;
m_ = m;
h_ = h;
if (s_ < 10) { s_ = "0" + s_; }
if (m_ < 10) { m_ = "0" + m_; }
if (h_ < 10) { h_ = "0" + h_; }
text = h_ + "：" + m_ + "：" + s_ + " ：" + ms_[0] + ms_[1];
tick.innerHTML = text;
}
var timer
function start(el) {
clearInterval(timer);
if (el.innerHTML == '开始计时') {
timer = setInterval("clock()", 10);
el.innerHTML='暂停'
return;
}
el.innerHTML = '开始计时';
var time = document.createElement("span");
time.innerHTML = tick.innerHTML + "<br>";
t.appendChild(time);
}
function stop() {
clearInterval(timer);
var stop = document.getElementsByTagName("span");
for (var i = 0; i < stop.length; i++) {
var object = t.removeChild(stop[i]);
}
ms = 00;
s = 00;
m = 00;
h = 00;
text = h + "：" + m + "：" + s + " ：" +0 ;
t.innerHTML = text;
}
</script>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>秒表</title>
<style>
#bor {
width: 200px;
height: 300px;
margin: auto;
margin-top: 100px;
border: black solid 1px;
background-color: cornflowerblue;
}
#show {
width: 100px;
line-height: 40px;
margin: 40px auto;
/*background-color: blueviolet;*/
text-align: center;
font-size: larger;
}
#start,#reset,#stop{
width: 100px;
height: 30px;
margin: 10px;
color: white;
border-color: wheat;
background-color: black;
}
#btnWarp {
text-align: center;
}
</style>
</head>
<body>
<div id="bor">
<div id="show">
00:00:00
</div>
<div id="btnWarp">
<button id="start">开始</button>
<button id="stop">暂停</button>
<button id="reset">复位</button>
</div>
</div>
<script>
function $(something) {
return document.querySelector(something);
}
let i = 0;
let isCounting = false;
let time = $('#show');
let intervalID = undefined;
let double = function (m) {
return m < 10 ? `0${m}` : `${m}`;
}
let show = function (t, sh) {
t.innerHTML = sh + '';
}
let showTime = function (n) {
const hour = parseInt(n / 360);
const min = parseInt(n / 60) % 60;
const sec = n % 60;
return `${double(hour)}:${double(min)}:${double(sec)}`;
}
$('#start').onclick = function () {
if (isCounting) {
return
}
isCounting = true;
intervalID = setInterval(function () {
i++;
show(time, showTime(i));
}, 1000);
}
$('#stop').onclick = function () {
isCounting = false;
clearInterval(intervalID);
}
$('#reset').onclick = function () {
isCounting = false;
clearInterval(intervalID);
i = 0;
show(time, showTime(i));
}
</script>
</body>
</html>
您好，我是有问必答小助手，您的问题已经有小伙伴解答了，您看下是否解决，可以追评进行沟通哦~
如果有您比较满意的答案 / 帮您提供解决思路的答案，可以点击【采纳】按钮，给回答的小伙伴一些鼓励哦～～
ps:问答VIP仅需29元，即可享受5次/月 有问必答服务，了解详情>>>https://vip.csdn.net/askvip?utm_source=1146287632