Javascript/Jquery——简单定时器的多种实现方法


Posted in Javascript onJuly 03, 2013

第一种方法:

<%@ page language="java" contentType="text/html; charset=UTF-8"pageEncoding="UTF-8"%> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html> 
<head> 
<title>定时器</title> 
<script language="javascript" src="jquery-1.4.2.js"></script> 
<script language="javascript"> 
//使用setInterval间歇调用 (不建议使用该方法) 
$(function(){ 
setInterval(function(){ 
$("#currentTime").text(new Date().toLocaleString()); 
},1000); 
}); 
</script> 
</head> 
<body> 
<div id="currentTime"></div> 
</body> 
</html>

第二种方法:
<%@ page language="java" contentType="text/html; charset=UTF-8" 
pageEncoding="UTF-8"%> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<head> 
<title>定时器</title> 
<script language="javascript" src="jquery-1.4.2.js"></script> 
<script language="javascript"> 
//使用setTimeout超时调用 
function startTime(){ 
$("#currentTime").text(new Date().toLocaleString()); 
setTimeout('startTime()',1000); 
} 
</script> 
</head> 
<body onload="startTime()"> 
<div id="currentTime"></div> 
</body> 
</html>

第三种方法:
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<head> 
<title>定时器</title> 
<script type="text/javascript"> 
var c=0; 
var t; 
function timedCount(){ 
document.getElementById('txt').value=c; 
c=c+1; 
t=setTimeout("timedCount()",1000); 
} 
function stopCount(){ 
clearTimeout(t); 
} 
</script> 
</head> 
<body> 
<form> 
<input type="button" value="开始计时!" onclick="timedCount()"/> 
<input type="text" id="txt"/> 
<input type="button" value="停止计时!" onclick="stopCount()"/> 
</form> 
</body> 
</html>
Javascript 相关文章推荐
jquery 实现的全选和反选
Apr 15 Javascript
ExtJs的Date格式字符代码
Dec 30 Javascript
基于jquery跨浏览器显示的file上传控件
Oct 24 Javascript
针对初学者的jQuery入门指南
Aug 15 Javascript
基于Node.js实现nodemailer邮件发送
Jan 26 Javascript
AngularJS折叠菜单实现方法示例
May 18 Javascript
原生js实现移动端Touch轮播图的方法步骤
Jan 03 Javascript
Vue项目引发的「过滤器」使用教程
Mar 12 Javascript
JavaScript之数组扁平化详解
Jun 03 Javascript
JS实现滚动条触底加载更多
Sep 19 Javascript
Javascript 类型转换、封闭函数及常见内置对象操作示例
Nov 15 Javascript
请求时token过期自动刷新token操作
Sep 11 Javascript
jquery滚动组件(vticker.js)实现页面动态数据的滚动效果
Jul 03 #Javascript
JS去除右边逗号的简单方法
Jul 03 #Javascript
JavaScript实现QueryString获取GET参数的方法
Jul 02 #Javascript
jQuery 全选/反选以及单击行改变背景色实例
Jul 02 #Javascript
计算新浪Weibo消息长度(还可以输入119字)
Jul 02 #Javascript
jquery获取iframe中的dom对象(两种方法)
Jul 02 #Javascript
JS实现可改变列宽的table实例
Jul 02 #Javascript
You might like
php中使用Ajax时出现Error(c00ce56e)的详细解决方案
2014/11/03 PHP
php提示Warning:mysql_fetch_array() expects的解决方法
2014/12/16 PHP
PHP读取配置文件类实例(可读取ini,yaml,xml等)
2015/07/28 PHP
php版微信小店调用api示例代码
2016/11/12 PHP
JQuery获取浏览器窗口内容部分高度的代码
2012/02/24 Javascript
解决Extjs上传图片无法预览的解决方法
2012/03/22 Javascript
使用Grunt.js管理你项目的应用说明
2013/04/24 Javascript
jquery绑定事件不生效的解决方法
2014/02/11 Javascript
js加减乘除丢失精度问题解决方法
2014/05/16 Javascript
node.js中的定时器nextTick()和setImmediate()区别分析
2014/11/26 Javascript
jQuery编程中的一些核心方法简介
2015/08/14 Javascript
Angular.js回顾ng-app和ng-model使用技巧
2016/04/26 Javascript
JS中对象与字符串的互相转换详解
2016/05/20 Javascript
获取jqGrid中选择的行的数据
2016/11/30 Javascript
用纯Node.JS弹出Windows系统消息提示框实例(MessageBox)
2017/05/17 Javascript
微信分享调用jssdk实例
2017/06/08 Javascript
package.json各个属性说明详解
2020/03/11 Javascript
通过高德地图API获得某条道路上的所有坐标用于描绘道路的方法
2020/08/24 Javascript
[12:36]《DOTA2》国服注册与激活指南全攻略
2013/04/28 DOTA
[01:30]我们共输赢 完美世界城市挑战赛开启全新赛季
2019/04/19 DOTA
Python序列之list和tuple常用方法以及注意事项
2015/01/09 Python
Python实现提取谷歌音乐搜索结果的方法
2015/07/10 Python
pandas 对每一列数据进行标准化的方法
2018/06/09 Python
python3 写一个WAV音频文件播放器的代码
2019/09/27 Python
在python3.9下如何安装scrapy的方法
2021/02/03 Python
Skyscanner台湾:全球知名的旅行比价引擎
2018/07/01 全球购物
Java里面有没有全局变量?为什么?
2015/02/06 面试题
为什么UNION ALL比UNION快
2016/03/17 面试题
英文自荐信
2013/12/19 职场文书
大学毕业感言100字
2014/02/03 职场文书
2015年档案室工作总结
2015/05/23 职场文书
医院党建工作总结2015
2015/05/26 职场文书
趣味运动会通讯稿
2015/07/18 职场文书
2016春季运动会通讯稿
2015/07/18 职场文书
Python中for后接else的语法使用
2021/05/18 Python
MySQL系列之十四 MySQL的高可用实现
2021/07/02 MySQL