`
liu_haibo
  • 浏览: 4789 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
最近访客 更多访客>>
文章分类
社区版块
存档分类
最新评论

js定时器

 
阅读更多
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script language="JavaScript" type="text/javascript">  
function djs(){  
var urodz= new Date("11/12/2008");   
var now = new Date();  
var num  
var ile = urodz.getTime() - now.getTime();    
var dni = Math.floor(ile / (1000 * 60 * 60 * 24));    
if (dni >1)    
num=dni+1
else if (dni == 1) num=2   
else if (dni == 0) num=1
else num=0   
document.write(num)    
}  
</script>  

距某某开幕式还有 [<script language="JavaScript" type="text/javascript">djs()</script>] 天  
第五个:Javascript倒计时器 - 采用系统时间自校验  
这次利用系统时间自校验倒计时, 无需手工调校使得倒计时更为精确, 代码及详细注释如下:  

<span id="clock">00:01:11:00</span>  
<input id="startB" type="button" value="start countdown!" onclick="run()">  
<input id="endB" type="button" value="stop countdown!" onclick="stop()">  
<br>  
<input id="diff" type="text">  
<input id="next" type="text">  
<script language="Javascript">  

var normalelapse = 100;  
var nextelapse = normalelapse;  
var counter;   
var startTime;  
var start = clock.innerText;   
var finish = "00:00:00:00";  
var timer = null;  

// 开始运行  
function run() {  
startB.disabled = true;  
endB.disabled = false;  
counter = 0;  
// 初始化开始时间  
startTime = new Date().valueOf();  

// nextelapse是定时时间, 初始时为100毫秒  
// 注意setInterval函数: 时间逝去nextelapse(毫秒)后, onTimer才开始执行  
timer = window.setInterval("onTimer()", nextelapse);   
}  

// 停止运行  
function stop() {  
startB.disabled = false;  
endB.disabled = true;  
window.clearTimeout(timer);  
}  

window.onload = function() {  
endB.disabled = true;  
}  

// 倒计时函数  
function onTimer()  
{  

if (start == finish)  
{  
window.clearInterval(timer);  
alert("time is up!");  
return;  
}  

var hms = new String(start).split(":");  
var ms = new Number(hms[3]);  
var s = new Number(hms[2]);  
var m = new Number(hms[1]);  
var h = new Number(hms[0]);  
    
ms -= 10;  
if (ms < 0)  
{  
ms = 90;  
s -= 1;  
if (s < 0)  
{  
    s = 59;  
    m -= 1;  
}  
    
if (m < 0)  
{  
    m = 59;  
    h -= 1;  
}  
}  

var ms = ms < 10 ? ("0" + ms) : ms;  
var ss = s < 10 ? ("0" + s) : s;  
var sm = m < 10 ? ("0" + m) : m;  
var sh = h < 10 ? ("0" + h) : h;  

start = sh + ":" + sm + ":" + ss + ":" + ms;  
clock.innerText = start;  

// 清除上一次的定时器  
window.clearInterval(timer);  

// 自校验系统时间得到时间差, 并由此得到下次所启动的新定时器的时间nextelapse  
counter++;   
var counterSecs = counter * 100;  
var elapseSecs = new Date().valueOf() - startTime;  
var diffSecs = counterSecs - elapseSecs;  
nextelapse = normalelapse + diffSecs;  
diff.value = counterSecs + "-" + elapseSecs + "=" + diffSecs;  
next.value = "nextelapse = " + nextelapse;  
if (nextelapse < 0) nextelapse = 0;  

// 启动新的定时器  
timer = window.setInterval("onTimer()", nextelapse);   
}  
</script>
分享到:
评论

相关推荐

    关于JS定时器(setTimeout setInterval)定时不准问题1

    关于JS定时器(setTimeout setInterval)定时不准问题1 在JavaScript中,setTimeout和setInterval是两个基本的定时器函数,用于实现延迟执行或循环执行某个函数。然而,这两个函数在执行时往往和我们设置的延迟时间...

    Javascript定时器 一 单线程 修正

    JavaScript定时器是编程中不可或缺的一部分,它允许我们延迟或周期性地执行代码。在这个主题中,我们将深入探讨JavaScript中的定时器机制,特别是与单线程环境相关的方面。 首先,JavaScript是一种解释型、基于原型...

    js定时器例子

    JavaScript定时器是JavaScript编程中的重要概念,主要用于在特定时间间隔执行特定任务。在这个"js定时器例子"中,我们可以深入探讨两种主要类型的定时器:`setTimeout`和`setInterval`。 1. `setTimeout`定时器: ...

    js定时器(执行一次、重复执行)

    JavaScript定时器是编程中用于控制代码执行时机的重要工具,它们允许开发者在特定的时间间隔后执行某段代码。本文将深入探讨两种主要类型的JavaScript定时器:一次性执行的定时器(setTimeout)和重复执行的定时器...

    轻松解决JavaScript定时器越走越快的问题

    解决JavaScript定时器越走越快的问题 之前在项目中写了定时器来做循环播放,但是总是会有越走越快的问题,开始是以为前后的HTML代码拼接的有问题,时间紧急的情况下反复改了很多也没什么效果,后来发现是js定时器的...

    Javascript定时器 一 单线程

    JavaScript定时器是编程中不可或缺的一部分,它允许我们延迟或周期性地执行代码,为Web应用程序带来动态和交互性。在JavaScript的世界里,定时器主要由`setTimeout`和`setInterval`两个函数提供。本篇文章将深入探讨...

    js 封装定时器解决多次调用定时器叠加问题及定时器无法清除的问题

    在JavaScript编程中,定时器(Timer)是常用于实现异步操作的重要工具,例如延迟执行、周期性执行任务。然而,如果不妥善管理,定时器可能会引发一些问题,比如多次调用定时器导致叠加,以及定时器无法清除。本文将...

    js定时器实例红绿灯效果网页

    首先,让我们了解一下JavaScript定时器。在JavaScript中,有两个主要的定时器方法:`setTimeout()` 和 `setInterval()`. `setTimeout()` 用于在指定的毫秒数后执行一次函数,而 `setInterval()` 则会每隔一定时间...

    关于js定时器和js事件基础案例小练习附知识点.html

    每天进步一点点,加油!

    js定时器+ajax,间隔10s调用一次

    主要用于消息提醒,利用js页面定时器,定时提交ajax请求,查询最新的消息记录。改了很多次,终于成功了。

    【JavaScript源代码】利用JS定时器实现元素移动.docx

    ### JavaScript定时器实现元素移动详解 #### 一、前言 在前端开发中,通过JavaScript实现元素的动态效果是常见的需求之一。其中,利用定时器(Timer)来控制元素的移动是一种非常实用的技术手段。本文将详细介绍...

    Javascript定时器 三 setTimeout func 0

    JavaScript定时器是编程中一种非常重要的机制,它允许我们在特定的时间间隔后执行代码。本篇文章主要探讨`setTimeout(func, 0)`这一特定用法,它在JavaScript中的作用和实际应用场景。 `setTimeout`函数是...

    JavaScript定时器范例2则

    JavaScript定时器是Web开发中非常重要的一个概念,它允许开发者在特定的时间间隔内执行某段代码,从而实现动态效果或者异步操作。本篇将详细讲解两个JavaScript定时器的使用范例。 首先,我们来看看JavaScript中的...

    JavaScript事件添加定时器

    很多人都会遇到图片的轮播效果,并且两分钟播放一下,这时候就会需要定时器,那么js定时器是什么?js定时器是利用js实现定时的一种方法,在网站上有很多用途都是用到定时器,很多在线时钟的制作,图片轮播的实现,...

    javascript定时器实现的蛇形文字

    JavaScript定时器实现的蛇形文字是一种有趣的编程小实验,它利用了JavaScript的动态特性来创建一个类似游戏"贪吃蛇"的文字效果。在这个程序中,字符会在页面上以蛇形移动,给人带来一种视觉上的趣味性。这个效果的...

    javascript定时器取消定时器及优化方法

    javascript定时器取消定时器及js定时器优化方法 通常用的方法: 启动定时器: window.setInterval(Method,Time) Method是定时调用的js方法 Time是间隔时间,单位是毫秒 取消定时器: clearInterval(Method);...

    js定时器+简单的动画效果实例

    通过以上两个示例,我们可以看到JavaScript定时器在实现网页动态效果中的核心作用。它允许开发者按照预定的时间间隔执行一系列操作,从而创造出流畅的动画体验。结合CSS样式和JavaScript事件处理,我们可以创造出...

Global site tag (gtag.js) - Google Analytics