JavaScript setTimeout函数
setTimeout的作用:延迟一段时间执行某个函数。
例如:setTimeout(function(){alert("延迟5秒执行...")},5000);
注意:setTimeout()不是循环执行,只执行一次。
setTimeout是异步调用,setTimeout方法与其后的方法同时执行。
例如:setTimeout(function(){alert("延迟5秒执行...")},5000);
alert("判断setTimeout是否是异步执行,如果先弹出则表示是异步执行。");
执行结果可以证明setTimeout是异步的。
使用setTimeout实现计时器的算法:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>setTimeout计时器的实现</title>
<script type="text/javascript" language="javascript">
var time = 0;
function currTimeView(){
document.getElementById("currTime").value = time + "秒";
}
/**开始计时*/
function startTime(){
time++;
currTimeView();
tid = setTimeout("startTime();",1000);
}
/**开始计时*/
function stopTime(){
clearTimeout(tid);
}
/**开始计时*/
function clearTime(){
time = 0;
document.getElementById("currTime").value = "开始计时...";
}
</script>
</head>
<body>
<input id="currTime" type="text" value="开始计时..." />
<br />
<input id="start" value="开始计时" type="button" onclick="startTime()" />
<input id="stop" value="停止计时" type="button" onclick="stopTime()" />
<input id="clear" value="清空计时" type="button" onclick="clearTime()" />
</body>
</html>