<!DOCTYPE html>
<html>
<head><title>Hello HTML5</title></head>
<body>
<progress id="progress" value="50" max="100">5/100</progress>
<input type="button" onclick="add()" value="增加"/>
<input type="button" onclick="minus()" value="减少"/>
<input type="button" onclick="auto_add()" value="自动增加"/>
<script>
function add(){
var progress = document.getElementById("progress");
if(progress.value<100){
progress.value+=10;
}
}
function minus(){
var progress = document.getElementById("progress");
if(progress.value>0){
progress.value-=10;
}
}
function auto_add(){
var progress = document.getElementById("progress");
var t=window.setInterval("if(progress.value<100){progress.value+=1;}",10);
}
</script>
</body>
</html>
以上是html5的代码,我想在点击了自动增加按钮后进度条自动填满,填满的时候自动移除interval,不然等填满了点击旁边的减少按钮,它还是会继续填充满
定时器一般有两个
1)setTimeout();//n毫秒后执行一次
2)setInterval();//每隔n秒执行一次
这两个方法都有个返回值,返回一个定时器id,可以定义一个变量接收
清除定时器方法:
setTimeout()对应的是 clearTimeout(id);
setInterval()对应的是 clearInterval(id);
下面有个例子:
<script>js中两种定时器的设置及清除
循环执行:
var timeid = window.setInterval(“方法名或方法”,“延时”);
window.clearInterval(timeid);
<script type="text/javascript">
$(document).ready(function(){ //循环执行,每隔1秒钟执行一次 1000 var
t1=window.setInterval(refreshCount, 1000);
function refreshCount() {
console.log("ready");
}
//去掉定时器的方法
window.clearInterval(t1);
});
</script>
2.定时执行:当方法执行完成定时器停止(但是定时器还在,只不过没用了);
var tmid = window.setTimeout(“方法名或方法”, “延时”);
window.clearTimeout(tmid);
<script type="text/javascript">
$(document).ready(function(){ //定时执行,5秒后执行
var t1=window.setTimeout(refreshCount, 1000 * 5); function refreshCount() {
console.log("ready");
} //去掉定时器的方法 window.clearTimeout(t1);
});
</script>
我也知道用这个函数,但clearInterval需要个参数,不知道怎么填
追答var timer=setInterval(.........);
clearInterval(timer);
可以了 谢谢~~ 再请教下clearInterval(timer)之后,我在clear方法之后print了下timer,发现timer并没有被销毁,那如果我想判断timer是否还在运行,应该用什么方法?