                        课程
                    
                        /前端开发
                        
                            /JavaScript
                        
                        /JavaScript进阶篇

我想问一下，如果把计数器改成显示当前时间不断刷新，但是点击“stop”按钮可以停下计时，如果再单击的时候可以刷新当前时间并计时，怎么弄呢？以下是我的代码，感觉少了什么东西，但是不知道怎么加上去

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<meta http-equiv="X-UA-Compatible" content="ie=edge">

<title>计时器延迟时间</title>

<script type="text/javascript">

var num=new Date();

var i;

var n;

i=setInterval("startCount()",1000);

function startCount(){

var num=new Date();

n=num.getTime()+1;

document.getElementById('count').value=num;

i=setTimeout("startCount()",1000);

}

function stopCount(){

var j=clearTimeout(i);

}

</script>

</head>

<body>

<form>

<input type="text" id="count" size="50" readonly="readonly" />

<input type="button" value="Start" onclick="startCount()"/>

<input type="button" value="Stop" onclick="stopCount()"/>

</form>

</body>

</html>

最爱是雪碧_球球

2018-08-07

源自：JavaScript进阶篇 8-6

关注问题我要回答

987

操作

收起

4 回答

慕设计2718092
2018-10-30

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<meta http-equiv="X-UA-Compatible" content="ie=edge">

<title>计时器延迟时间</title>

<script type="text/javascript">

// var num=new Date(); num是函数内部的变量，仅仅用来显示所以不需要在外部定义

// var i;

// var n;

setTimeout("startCount()",10); // 此处应该是setTimeout开始时调用一次函数即可,setInterval 停不下来

function startCount(){

var num=new Date();

n=num.getTime()-10;

document.getElementById('count').value=num;

i=setTimeout("startCount()",1000);

}

function stopCount(){

clearTimeout(i);

}

</script>

</head>

<body>

<form>

<input type="text" id="count" size="50" readonly="readonly" />

<input type="button" value="Start" onclick="startCount()"/>

<input type="button" value="Stop" onclick="stopCount()"/>

</form>

</body>

</html>

0 回复有任何疑惑可以回复我~

夏析
2018-08-31

你 start 两次后，也不能 stop

0 回复有任何疑惑可以回复我~

最爱是雪碧_球球提问者
2018-08-07

不好意思，我多了一行代码，所以才会不能stop

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<meta http-equiv="X-UA-Compatible" content="ie=edge">

<title>计时器延迟时间</title>

<script type="text/javascript">

var num=new Date();

var i;

var n;

function startCount(){

var num=new Date();

n=num.getTime()+1;

document.getElementById('count').value=num;

i=setTimeout("startCount()",1000);

}

function stopCount(){

var j=clearTimeout(i);

}

</script>

</head>

<body>

<form>

<input type="text" id="count" size="50" readonly="readonly" />

<input type="button" value="Start" onclick="startCount()"/>

<input type="button" value="Stop" onclick="stopCount()"/>

</form>

</body>

</html>

0 回复有任何疑惑可以回复我~

四年十六季
2018-08-07

可以声明一个全局变量默认值为：var state="start";

点stop的时候，先验证state是哪个值，如果是start，证明是第一次点，然后进行一个动作；

此时state的值改为“stop”，第二次点的时候，state的值对应了stop，证明是关闭后又开启，然后执行另一个动作，此时将state的值再改为“start”

0 回复有任何疑惑可以回复我~

#1

最爱是雪碧_球球提问者

不好意思，我多了一行i=setInterval("startCount()",1000);代码，所以才会不能stop

2018-08-07 回复有任何疑惑可以回复我~

举报

0/150

提交

取消

JavaScript进阶篇

参与学习 468259 人
解答问题 21891 个

本课程从如何插入JS代码开始，带您进入网页动态交互世界

本课相似问答

2 回答再加个按钮“刷新”，，，stop停止后，按刷新又可以继续计时，该怎么弄呢？大神们

2 回答怎么点击stop按钮计时器不停止？

3 回答想不通，clearInterval是取消计时器，点击后计时器取消了，为什么时间会停下来呢？

1 回答想实现按钮点一下开始计时，再次点击停止，再点又开始，以此类推。。。代码如下为么不可以？

4 回答为啥出来的结果，再点击stop按钮后，时间为啥没有停止计时呢？

搜索更多本课相关问答

我想问一下，如果把计数器改成显示当前时间不断刷新，但是点击“stop”按钮可以停下计时，如果再单击的时候可以刷新当前时间并计时，怎么弄呢？以下是我的代码，感觉少了什么东西，但是不知道怎么加上去

我要回答关注问题

意见反馈帮助中心 APP下载