<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>计时器</title>
<script type="text/javascript">
//获取当前时间并赋值给显示输入框的value
function clock(){
var time=new Date();
document.getElementById("clock").value = time;
}
//每秒执行一次赋值方法
function start(){
var i = setInterval("clock()",100);
}
//想让时间显示停下来的方法
function stop(){
var i = setInterval("clock()",100)
clearInterval(i);
}
</script>
</head>
<body>
<form>
<input type = "text" id = "clock" size = "50" />
<input type = "button" value = "start" onclick = "start()" />
<input type="button" value="stop" onclick= "stop()" >
</form>
</body>
</html>当点击"start"的时候 输入框里的时间显示正常,达到预期的动态显示时间的效果.问题是:当点击"stop"的时候,希望实现的功能是:input里面的时间不再随时间变化,停在当前时间,我自己写的不知道哪里问题,时间还是会动态变化的.
2 回答
已采纳
刚毅87
TA贡献345条经验 获得超309个赞
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>计时器</title>
<script type="text/javascript">
//将 赋值给i 写在函数外面
var i;
//获取当前时间并赋值给显示输入框的value
function clock(){
var time=new Date();
document.getElementById("clock").value = time;
}
//每秒执行一次赋值方法
function start(){
// 使用定时器要遵循先关后开的原则,不然多次点击会加速
clearInterval(i);
i = setInterval("clock()",100);
}
function stop(){
clearInterval(i);
}
</script>
</head>
<body>
<form>
<input type = "text" id = "clock" size = "50" />
<input type = "button" value = "start" onclick = "start()" />
<input type="button" value="stop" onclick= "stop()" >
</form>
</body>
</html>注释都写在代码中了.
望采纳!
添加回答
举报
0/150
提交
取消