javascript定时器完整实例

 这篇文章主要介绍了javascript定时器完整实现方法,以实例形式分析了定时器的嵌套调用技巧,具有一定参考借鉴价值,需要的朋友可以参考下

 
 

本文实例讲述了javascript定时器完整实现方法。分享给大家供大家参考。具体实现方法如下:

 

代码如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>定时器</title>
<script type="text/javascript">
var timer = null;
function begin() {
var date = new Date();
var current_time = date.getFullYear() + '-' + date.getMonth() + '-' + date.getDate() + ' ';
current_time += date.getHours() + ':' + date.getMinutes() + ':' + date.getSeconds();
document.getElementById('current_time').value = current_time;
timer = setTimeout('begin()', 1000);
}
function end() {
clearTimeout(timer); //清除掉定时器对象
}
</script>
</head>
<body>
<input type="text" name="current_time" id="current_time"/><input type="button" value="开始" onclick="begin();">
<input type="button" value="结束" onclick="end();"/><br/>
</body>
</html>

 

希望本文所述对大家的javascript程序设计有所帮助。

时间: 2024-12-22 16:13:57

javascript定时器完整实例的相关文章

javascript定时器完整实例_javascript技巧

本文实例讲述了javascript定时器完整实现方法.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type&qu

JavaScript定时器详解及实例

这篇文章详细介绍了JavaScript定时器及实例,有需要要的朋友可以参考一下   JS里设定延时: 使用SetInterval和设定延时函数setTimeout 很类似.setTimeout 运用在延迟一段时间,再进行某项操作. setTimeout("function",time) 设置一个超时对象 setInterval("function",time) 设置一个超时对象 SetInterval为自动重复,setTimeout不会重复. clearTimeou

JavaScript实现简洁的俄罗斯方块完整实例_javascript技巧

本文实例讲述了JavaScript实现简洁的俄罗斯方块.分享给大家供大家参考,具体如下: 先来看看运行效果图: 完整实例代码如下: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>俄罗斯方块</title> <style ty

jQuery实现内容定时切换效果完整实例_jquery

本文实例讲述了jQuery实现内容定时切换效果.分享给大家供大家参考,具体如下: <!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"> <he

js实现简单实用的AJAX完整实例_AJAX相关

本文实例讲述了js实现简单实用的AJAX的方法.分享给大家供大家参考,具体如下: //版权归属 WUJXPING //ajax 1.2 //更新2012-2-20 //1.异步数据加载可以进行加载方式get,post的设定 //2.异步同步模式的属性设定 //3.数据加载自动超时设置 //4.***数据加载事件的添加,通过事件可以进行服务器数据的实时处理 //5.增加回调函数中用户自定义参数this.e //6.增加ajax反复提交控制,只需将ajax对象定义为全局变量,每次提交都会进行等待上次

Javascript定时器学习笔记

掌握定时器工作原理必知:JavaScript引擎是单线程运行的,浏览器无论在什么时候都只且只有一个线程在运行JavaScript程序. 常言道:setTimeout和setInterval是伪线程. Javascript是运行在单线程环境中的,在页面的声明周期中,不同时间可能有其他代码在控制Javascript进程,比如:包含 在<script>元素中的代码.dom元素的事件处理程序.Ajax的回调函数.定时器仅仅是在未来的某个时刻将代码添加到代码队列中,执行时机是不能保证的.代码队列按照先进

jsp分页显示完整实例

 这篇文章主要介绍了jsp分页显示完整实例,以文章管理页面为例详细分析了jsp的分页显示实现技巧,具有一定参考借鉴价值,需要的朋友可以参考下 本文实例讲述了jsp分页显示的实现方法.分享给大家供大家参考. 具体实现方法如下: 代码如下: <%@ page contentType="text/html; charset=gb2312" language="java" import="java.sql.*" errorPage="&q

js实现的捐赠管理完整实例

 这篇文章主要介绍了js实现的捐赠管理完整实例,包括了html页面.js脚本及css样式的完整实现代码,具有一定参考借鉴价值,需要的朋友可以参考下     本文实例讲述了js捐赠管理完整实现方法.分享给大家供大家参考.具体实现方法如下: index.html页面如下:   代码如下: <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equ

JS+CSS实现可拖拽的漂亮圆角特效弹出层完整实例

 这篇文章主要介绍了JS+CSS实现可拖拽的漂亮圆角特效弹出层,以完整实例形式分析了弹出层特效及圆角矩形的实现技巧,需要的朋友可以参考下     本文实例讲述了JS+CSS实现可拖拽的漂亮圆角特效弹出层的方法.分享给大家供大家参考.具体如下:   代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-tran