计时器setTimeout()

setTimeout()计时器,在载入后延迟指定时间后,去执行一次表达式,仅执行一次。

语法:

setTimeout(代码,延迟时间);

参数说明:

1. 要调用的函数或要执行的代码串。

2. 延时时间:在执行代码前需等待的时间,以毫秒为单位(1s=1000ms)。

当我们打开网页3秒后,在弹出一个提示框,代码如下:

<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript">
setTimeout("alert('Hello!')", 3000 );
</script>
</head>
<body>
</body>
</html>

当按钮start被点击时,setTimeout()调用函数,在5秒后弹出一个提示框。

<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript">
function tinfo(){
var t=setTimeout("alert('Hello!')",5000);
}
</script>
</head>
<body>
<form>
<input type="button" value="start" onClick="tinfo()">
</form>
</body>
</html>

要创建一个运行于无穷循环中的计数器,我们需要编写一个函数来调用其自身。在下面的代码,当按钮被点击后,输入域便从0开始计数。

<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript">
var num=0;
function numCount(){
document.getElementById('txt').value=num;
num=num+1;
setTimeout("numCount()",1000);
}
</script>
</head>
<body>
<form>
<input type="text" id="txt" />
<input type="button" value="Start" onClick="numCount()" />
</form>
</body>
</html>

任务

补充右边编辑器第12和14行,使用setTimeout()实现计数统计效果,并在文本框中显示数值。

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>计时器</title>
</head>
<script type="text/javascript">
var num=0;
function startCount() {
document.getElementById('count').value=num;
num=num+1;
setTimeout("startCount()",1000) ;
}
setTimeout("startCount()",1000);
</script>
</head>
<body>
<form>
<input type="text" id="count" />
</form>
</body>
</html>

最新文章

  1. Python中内置数据类型list,tuple,dict,set的区别和用法
  2. Gulp入门教程(转载)
  3. 版本控制工具VSS使用介绍
  4. 【面试虐菜】—— LVS负载均衡
  5. ActiveMQ使用教程
  6. Android 安装过程中的问题
  7. URI、URL、URN
  8. android 自定义AlertDialog(一段)
  9. Educational Codeforces Round 63 (Rated for Div. 2) B. Game with Telephone Numbers 博弈思维+模拟+贪心思维
  10. hadoop启动 datanode的live node为0
  11. win10 solidity开发环境搭建
  12. 虚拟机安装mysql
  13. python+unittest+requests+HTMLRunner编写接口自动化测试集
  14. 洛谷 P1359 租用游艇【dp】(经典)
  15. nginx日志分析工具
  16. CentOS7(linux) 通过服务名查询安装目录
  17. PHP实现装饰器
  18. CentOS下samba配置心得(smb和nmb都要启动)
  19. .yml文件格式
  20. forget suffix word aby able ability out 1

热门文章

  1. 43-python基础-python3-字符串-常用字符串方法(一)-upper()-lower()-isupper()-islower()
  2. vue 动态绑定height以及v-if、v-else的使用
  3. START TRANSACTION - 开始一个事务块
  4. nginx信号及平滑升级
  5. 【学术篇】CF833B TheBakery 分治dp+主席树
  6. Codeforces 1149D 最短路 状压DP
  7. 视频专家之路【三】:Vs开发环境的搭建
  8. 笔记68 Redis数据库
  9. 使用SOAPui 笔记
  10. vue 使用Animate.css库