写了个超简单的 js 倒计时，使用了 jquery1.4.2 库，
程序就是1个 html ，可以直接执行，（需要联网，因为引用了在线 jquery 库）
倒计时程序：
<?xml version="1.0" encoding="UTF-8" ?>
<!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>倒计时 - js</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
// Interval 的 id，用于取消定时
var interId;
/**
* 根据毫秒数显示时间
* @param t 毫秒数
*/
function showTime(t) {
// 总秒数
var xt = parseInt(t/1000);
// 秒数
var remain_sec = xt % 60;
xt = parseInt(xt/60);
// 分数
var remain_minute = xt % 60;
xt = parseInt(xt/60);
// 小时数
var remain_hour = xt % 24;
xt = parseInt(xt/24);
// 天数
var remain_day = xt;
// 设置倒计时各字段的值
$('#secondSpanId').html(remain_sec);
$('#minuteSpanId').html(remain_minute);
$('#hourSpanId').html(remain_hour);
$('#daySpanId').html(remain_day);
}
/**
* 取消 倒计时
*/
function cancelCountdown() {
clearInterval(interId);
}
/**
* 倒计时
*/
function countdown() {
// 获得剩余时间
var t = $('#remainTime').val();
if(t <= 0) { // 已经到时间了，则停止倒计时
cancelCountdown();
return;
}
// 减 1 秒
t = t - 1000;
if(t <= 0) {
t = 0;
}
// 设置隐藏域的值
$('#remainTime').val(t);
// 显示倒计时时间
showTime(t);
}
// 倒计时入口函数
function gate(){
if ($('#remainTime') != null) { // 尚未结束
// 获得毫秒数
var millSec = $('#remainTime').val();
if(Number(millSec) && millSec >= 0) { // 输入合法
// 初始显示
showTime(millSec);
// 倒计时开始
interId = setInterval("countdown()",1000);
// 禁用 开始 按钮
$('#startButton').attr('disabled',true);
} else {
alert('毫秒数不合法');
}
}
}
</script>
</head>
<body>
输入毫秒数：<input type="text" name="remainTime" id="remainTime" />
<input type="button" id="startButton" value="开始倒计时" onclick="gate();" />
<input type="button" id="endButton" value="清除倒计时" onclick="cancelCountdown();$('#startButton').attr('disabled',false);" />
<br />
<div id="countdownDiv">
<span><span id="daySpanId"></span>天</span>
<span><span id="hourSpanId"></span>时</span>
<span><span id="minuteSpanId"></span>分</span>
<span><span id="secondSpanId"></span>秒</span>
</div>
</body>
</html>
功能很简单，算法也不精良，demo 而已。。。
分享到：
相关推荐
JS倒计时
JavaScript倒数计时器是一种...以上就是JavaScript倒计时器的基本实现。通过这个功能，我们可以创建一个简单的网页，用户可以清楚地看到距离特定日期还有多少时间。这个例子中的代码简洁明了，适合初学者学习和参考。
JavaScript倒计时是一种常见的时间显示方式，常用于网站上的活动预告、考试倒计时或重要事件提醒等。在这个实例中，我们结合了JavaScript、CSS和jQuery来创建一个动态且具有视觉效果的倒计时计时器。以下是相关知识...
倒数计时器是JavaScript中常见的功能，它可以在网页上显示剩余时间，比如用于活动倒计时、考试倒计时等场景。本教程将详细讲解如何创建一个简单的JS倒数计时器，并教你如何理解并修改代码以适应自己的需求。 首先，...
JavaScript倒计时是一种常见的网页动态效果，用于显示特定时间点前的剩余时间。在这个场景中，我们有一个名为"timer.html"的文件，很可能是包含一个简单的JavaScript倒计时实现的HTML页面。下面将详细讲解JavaScript...
JavaScript（简称JS）倒计时是一种常见的Web前端功能，用于实现各种计时需求，例如活动结束倒计时、考试开始倒计时等。在给定的"js倒计时源码"中，我们可以探讨以下几个关键知识点： 1. **JavaScript基础**： - ...
1. JavaScript倒计时实现：通过使用JavaScript语言，实现了一个倒计时器，可以计算出距离结束时间的剩余时间，并实时显示倒计时。 2. 自定义结束时间：用户可以通过设置年、月、日三个参数，自定义结束时间，从而...
<title>JavaScript倒计时 <h1 id="countdown"></h1> <script src="js/countdown.js"> ``` 在`js`文件夹中的`countdown.js`文件应该包含上述的JavaScript代码。 这个基本的倒计时功能可以适应大多数需求，但...
js 倒数计时器 counttimedown javascript 写的时间倒数计时器
JavaScript（简称JS）倒计时源码是一种常见的前端开发技术，用于实现网页上的时间计时功能，例如活动截止、考试开始等场景。本资源包含一个实现了天、小时、分钟和秒显示的倒计时功能的JS代码示例。下面将详细讲解JS...
javascript实现倒计时
在提供的压缩包文件中，"js倒计时"可能包含了一个完整的JS倒计时实现，你可以查看源代码学习更多细节，比如如何将倒计时数据显示在网页上，或者如何处理时区问题。通过深入理解这些代码，你将能更好地掌握JS实现倒...
闲着没事 发个倒计时代码 可以精确到毫秒的
8. **模块化和封装**：在`TimeCircles.js`文件中，我们可以推测这是一个实现了环形倒计时功能的JavaScript模块。它可能包含一个构造函数，接收开始时间、持续时间等参数，以及初始化、更新和结束等方法。 9. **响应...
日常开发中，电商经常使用到抢购，不过当抢购的时候会用到倒计时
"纯js倒计时"是指利用JavaScript实现的一种计时功能，它能够显示从当前时间到设定日期之间的剩余时间，通常用于活动预告、节假日提醒等场景。这种倒计时的特点是不依赖于任何外部库或框架，只用JavaScript原生语法...
这个"带报警提示铃声的js倒计时代码"是一个利用JavaScript实现的特定功能，它能够帮助用户在倒计时结束时触发一个报警提示，通常用于活动即将开始或结束的提醒，或者是一些重要的时间节点通知。 首先，我们要理解...
JavaScript倒计时是一种常见的网页动态效果，用于显示距离某个特定时间点还有多少天、小时、分钟和秒。在本文中，我们将深入探讨如何使用JavaScript实现一个功能完整的倒计时功能，包括从服务器获取结束时间以及实时...
至此，我们已经创建了一个具备可配置开始时间、结束时间、服务器时间同步和循环使用功能的JavaScript倒计时器。在实际项目中，你可能还需要考虑时区差异、用户交互以及更复杂的UI显示等细节。通过以上代码，你可以...
首先，我们需要理解JavaScript倒计时的基本原理。倒计时通常是基于当前时间与目标时间之间的差值计算的。在JavaScript中，我们可以使用`Date`对象来获取当前时间，然后通过计算目标时间与当前时间的差值，设置定时器...