`
chenfeng_lian
  • 浏览: 10370 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

JS倒计时

    博客分类:
  • JS
 
阅读更多
<div>
    <span id="KSD">3</span>天
    <span id="KSH">12</span>小时
    <span id="KSM">39</span>分钟
    <span id="KSS">25</span>秒
</div>
 
 
<script type="text/javascript">
function countDown(targetTime, callback) {
    var t_timestamp = Date.parse(targetTime);
    var s_timestamp = new Date();
    c_timestamp = t_timestamp - s_timestamp; // 倒计时间戳
    if (c_timestamp > 0) {
        setTimeout(function callee() {
            countdownTime(c_timestamp);
            if (c_timestamp > 0) {
                c_timestamp -= 1000;
                setTimeout(callee, 1000);
            }
        }, 1);
    }
 
    // 计算倒计时间(天,小时,分钟,秒),并传入回调函数,执行回调
    function countdownTime(c_timestamp) {
        var d, h, m, s;
        c_timestamp = c_timestamp / 1000;
 
        d = parseInt(c_timestamp / 3600 / 24, 10); // 天数
        h = parseInt(c_timestamp / 3600 % 24, 10); // 小时
        m = parseInt(c_timestamp % 3600 / 60, 10); // 分钟
        s = parseInt(c_timestamp % 3600 % 60, 10); // 秒
 
        if (typeof callback === 'function') {
            callback(d, h, m, s);
        }
    }
};
 
var targetTime = '2013/11/12 00:00:00'; // 大于本地时间(假如本地时间为:2013/3/14 16:10:00)
countDown(targetTime, function(d, h, m, s) {
 
    // 补零
    for (var i = 0, len = arguments.length; i < len; i++) {
        if (String(arguments[i]).length < 2) {
            arguments[i] = '0' + arguments[i];
        }
    }
    // dom操作
    document.getElementById('KSD').innerHTML = h;
    document.getElementById('KSH').innerHTML = h;
    document.getElementById('KSM').innerHTML = m;
    document.getElementById('KSS').innerHTML = s;
});
</script>

 

分享到:
评论

相关推荐

    JS倒计时_javascript倒计时

    JS倒计时

    javascript 倒计时 实例

    JavaScript倒计时是一种常见的时间显示方式,常用于网站上的活动预告、考试倒计时或重要事件提醒等。在这个实例中,我们结合了JavaScript、CSS和jQuery来创建一个动态且具有视觉效果的倒计时计时器。以下是相关知识...

    JS倒计时_可自定义结束时间

    1. JavaScript倒计时实现:通过使用JavaScript语言,实现了一个倒计时器,可以计算出距离结束时间的剩余时间,并实时显示倒计时。 2. 自定义结束时间:用户可以通过设置年、月、日三个参数,自定义结束时间,从而...

    js倒计时源代码

    JavaScript倒计时是一种常见的网页动态效果,用于显示特定时间点前的剩余时间。在这个场景中,我们有一个名为"timer.html"的文件,很可能是包含一个简单的JavaScript倒计时实现的HTML页面。下面将详细讲解JavaScript...

    js倒计时源码

    JavaScript(简称JS)倒计时是一种常见的Web前端功能,用于实现各种计时需求,例如活动结束倒计时、考试开始倒计时等。在给定的"js倒计时源码"中,我们可以探讨以下几个关键知识点: 1. **JavaScript基础**: - ...

    javascript 实现网页 倒计时 代码

    &lt;title&gt;JavaScript倒计时 &lt;h1 id="countdown"&gt;&lt;/h1&gt; &lt;script src="js/countdown.js"&gt; ``` 在`js`文件夹中的`countdown.js`文件应该包含上述的JavaScript代码。 这个基本的倒计时功能可以适应大多数需求,但...

    JS倒计时源码

    JavaScript(简称JS)倒计时源码是一种常见的前端开发技术,用于实现网页上的时间计时功能,例如活动截止、考试开始等场景。本资源包含一个实现了天、小时、分钟和秒显示的倒计时功能的JS代码示例。下面将详细讲解JS...

    js实现倒计时时分秒

    在提供的压缩包文件中,"js倒计时"可能包含了一个完整的JS倒计时实现,你可以查看源代码学习更多细节,比如如何将倒计时数据显示在网页上,或者如何处理时区问题。通过深入理解这些代码,你将能更好地掌握JS实现倒...

    Asp.Net中实现js倒计时

    首先,我们需要理解JavaScript倒计时的基本原理。倒计时通常是基于当前时间与目标时间之间的差值计算的。在JavaScript中,我们可以使用`Date`对象来获取当前时间,然后通过计算目标时间与当前时间的差值,设置定时器...

    js倒计时 天+时+分+秒

    JavaScript倒计时是一种常见的网页动态效果,用于显示距离某个特定时间点还有多少天、小时、分钟和秒。在本文中,我们将深入探讨如何使用JavaScript实现一个功能完整的倒计时功能,包括从服务器获取结束时间以及实时...

    最全面的JS倒计时代码

    ### 知识点一:精确到秒的JavaScript倒计时实现 #### 1. HTML结构设计 在HTML中,需要设计一个表单`form`和一个文本输入框`input`,用以展示倒计时结果。例如: ```html 离2010年还有: ``` #### ...

    js倒计时,可设置开始结束时间

    至此,我们已经创建了一个具备可配置开始时间、结束时间、服务器时间同步和循环使用功能的JavaScript倒计时器。在实际项目中,你可能还需要考虑时区差异、用户交互以及更复杂的UI显示等细节。通过以上代码,你可以...

    js倒计时代码 精确到毫秒

    闲着没事 发个倒计时代码 可以精确到毫秒的

    带报警提示铃声的js倒计时代码

    这个"带报警提示铃声的js倒计时代码"是一个利用JavaScript实现的特定功能,它能够帮助用户在倒计时结束时触发一个报警提示,通常用于活动即将开始或结束的提醒,或者是一些重要的时间节点通知。 首先,我们要理解...

    js倒计时代码带css页面

    JavaScript倒计时是一种常见的网页动态效果,用于展示特定时间点的到来,例如促销活动开始、考试结束等。在网页开发中,结合CSS可以使得倒计时更具有视觉吸引力。本篇文章将详细探讨如何使用JavaScript和CSS实现一个...

    js实现倒计时

    javascript实现倒计时

    js 倒计时 产品

    3. `countdown.js`:这是核心的JavaScript倒计时脚本,实现了具体的倒计时逻辑。它可能包含了获取当前时间、计算剩余时间、设置定时器以定期更新显示等函数。 在实际应用中,JavaScript倒计时的实现通常包括以下...

    原生js实现倒计时功能 图片

    日常开发中,电商经常使用到抢购,不过当抢购的时候会用到倒计时

    js倒计时代码

    这就是一个基本的JavaScript倒计时实现。需要注意的是,这种实现方式没有处理闰秒,且假设一天始终有24小时,一年有365天。在实际应用中,可能需要更精确的处理方式,例如使用`moment.js`或`date-fns`等库来处理日期...

    纯js倒计时

    "纯js倒计时"是指利用JavaScript实现的一种计时功能,它能够显示从当前时间到设定日期之间的剩余时间,通常用于活动预告、节假日提醒等场景。这种倒计时的特点是不依赖于任何外部库或框架,只用JavaScript原生语法...

Global site tag (gtag.js) - Google Analytics