日期时间倒计时,删除小数,并在每个类别中保留时间显示时间

Date Time Countdown with removing decimals and having time display time left in each category

本文关键字:时间 保留 显示 删除 倒计时 小数 日期      更新时间:2023-09-26

最初,我在这里找到了一个倒计时问题的部分答案
("Cymen"谢谢你的回答!)

我该如何防止倒计时在剩余时间内使用小数

此外,我如何才能让它只说分钟还剩几秒,分钟还剩一小时,等等,就像这个网站上恰好有我要倒计时的确切日期和时间…
http://50onfire.com/dc/

以下是我编辑Cymen代码的内容:
http://jsfiddle.net/McdSV/

HTML

<div class="countdown"></div>
    <p class="labels">
        <span class="weeks">WEEKS </span>
        <span class="days">DAYS </span>
        <span class="hours">HOURS </span>
        <span class="minutes">MINUTES </span>
        <span class="seconds">SECONDS </span>
    </p>    

JS-

$(document).ready(function () {
    var date = new Date(2014, 11, 4, 19);
    var $display = $('.countdown');
    countdown($display, date);
    setInterval(function () { countdown($display, date); }, 1000);
});
var offset = get_time_zone_offset();
function countdown($display, collision) {
    var now = new Date();
    now.setHours(now.getHours() + (offset-5));
    var seconds = Math.ceil((collision.getTime() - now.getTime()) * 0.001);
    var minutes = Math.ceil(seconds/60);
    var hours = Math.ceil(seconds/60/60 * 10)/10;
    var days = Math.ceil((seconds/60/60/24) * 100)/100;
    var weeks = Math.ceil((days/7) * 100)/100;
    $display.html
    (
        '<p class="numbers">' + 
        collision + ((offset != 5) ? ' with time zone offset of ' + (offset-5) + ' hours' : '') +
        '<br><br><span id="weeks">' + weeks + '</span>' + 
        '<span id="days">' + days + '</span>' +
        '<span id="hours">' +hours + '</span>' +
        '<span id="minutes">' +minutes + '</span>' +
        '<span id="seconds">' +seconds + '</span>' +
        '</p>'
    );
}

尝试在$display.html之前添加以下代码

seconds = parseInt(seconds);
minutes = parseInt(minutes);
hours = parseInt(hours); 
days = parseInt(days);
weeks = parseInt(weeks); 

检查此项:

http://harshen.github.io/jquery-countdownTimer/

他们提供了你想要的东西,也提供了很好的描述和教程。如果你愿意,你也可以很容易地修改代码。

我修改了你的演示:

http://jsfiddle.net/patelbharat001/McdSV/154/

在这个过程中,我改变了你获得差异的过程,

检查一下,可能对你有帮助。

    var seconds1=Math.floor(((endDate-startDate)%(24*60*60*1000))/1000)%60%60;
    var seconds= ((60 + parseInt(seconds1)));

你想要这样吗?

Sat Jul 21 2012 15:30:00 GMT-0400 (Eastern Daylight Time)
seconds: 5
minutes: 0
hours: 13
days: 2
weeks: 119

JS Fiddle链接:演示

$(document).ready(function () {
    var date = new Date(2012, 6, 21, 15, 30);
    var $display = $('#countdown');
    countdown($display, date);
    setInterval(function () { countdown($display, date); }, 1000);
});
var offset = get_time_zone_offset();
function countdown($display, collision) {
    var now = new Date();
    now.setHours(now.getHours() + (offset-5));
    var seconds = Math.ceil((collision.getTime() - now.getTime()) * 0.001);
    var minutes = Math.ceil(seconds/60);
    var hours = Math.ceil(seconds/60/60 * 10)/10;
    var days = Math.ceil((seconds/60/60/24) * 100)/100;
    var weeks = Math.ceil((days/7) * 100)/100;
    //seconds = seconds - Math.floor(seconds / 60)*60
    $display
        .html
        (
            '<p>' + 
            collision + ((offset != 5) ? ' with time zone offset of ' + (offset-5) + ' hours' : '') +
            '<br>seconds: ' + Math.abs( Math.floor(-seconds / 60)*60 + seconds) +
            '<br>minutes: ' + Math.abs( Math.floor(-minutes / 60)*60 + minutes) +
            '<br>hours: ' + Math.floor(Math.abs( Math.floor(-hours / 24)*24 + hours)) +
            '<br>days: ' + Math.floor(Math.abs( Math.floor(-days / 7)*7 + days)) +
            '<br>weeks: ' + Math.floor(-weeks) +
            '</p>'
        );
}
function get_time_zone_offset() {
     var current_date = new Date( );
     var gmt_offset = current_date.getTimezoneOffset( ) / 60;
     return gmt_offset;
}