JavaScript发货计时器倒计时

JavaScript shipping timer countdown

本文关键字:倒计时 计时器 JavaScript      更新时间:2023-09-26

我的网站上有以下JavaScript,它显示了订单第二天交付的剩余时间。

if (document.getElementById('countdownTimer')) {
    pad = function(n, len) { // leading 0's
        var s = n.toString();
        return (new Array((len - s.length + 1)).join('0')) + s;
    };
    var timerRunning = setInterval(
        function countDown() {
            var now = new Date();
            if ((now.getDay() >= 1) && (now.getDay() <= 5)) { // Monday to Friday only
                var target = 15; // 15:00hrs is the cut-off point
                if (now.getHours() < target) { // don't do anything if we're past the cut-off point
                    var hrs = (target - 1) - now.getHours();
                    if (hrs < 0) hrs = 0;
                    var mins = 59 - now.getMinutes();
                    if (mins < 0) mins = 0;
                    var secs = 59 - now.getSeconds();
                    if (secs < 0) secs = 0;
                    var str = pad(hrs, 2) + ':' + pad(mins, 2) + '.<small>' + pad(secs, 2) + '</small>';
                    document.getElementById('countdownTimer').innerHTML = str;
                }
            }
        }, 1000
    );
}

问题是,在周六和周日,它总是显示00:00:00。我希望它能像在这个网站上一样计算周末的小时数:http://www.nakedwines.com/full_site

JavaScript真的不是我的领域,我完全不知道如何更改代码来实现这一点。如有任何帮助,我们将不胜感激。

Fiddle来了http://jsfiddle.net/rwet0o5f/

我已经将now.getDay()移到变量中,现在它应该更可读了。

weekday包含周日的0、周一的1和周六的6。周六,我们在截止日期前增加了48小时,星期天我们只增加24小时。

http://jsfiddle.net/37ox54bk/7/

if (document.getElementById('countdownTimer')) {
    pad = function(n, len) { // leading 0's
        var s = n.toString();
        return (new Array( (len - s.length + 1) ).join('0')) + s;
    };
    var timerRunning = setInterval(
        function countDown() {
            var target = 15; // 15:00hrs is the cut-off point
            var now = new Date();
            //Put this in a variable for convenience
            var weekday = now.getDay();
            if(weekday == 0){//Sunday? Add 24hrs
                target += 24;
            }
            if(weekday == 6){//It's Saturday? Add 48hrs
                target += 48;
            }
            //If between Monday and Friday, 
            //check if we're past the target hours, 
            //and if we are, abort.
            if((weekday>=1) && (weekday<=5)){
                if (now.getHours() > target) { //stop the clock
                    return 0;
                }                
            }
            var hrs = (target - 1) - now.getHours();
            if (hrs < 0) hrs = 0;
            var mins = 59 - now.getMinutes();
            if (mins < 0) mins = 0;
            var secs = 59 - now.getSeconds();
            if (secs < 0) secs = 0;
            var str = pad(hrs, 2) + ':' + pad(mins, 2) + '.<small>' + pad(secs, 2) + '</small>';
            document.getElementById('countdownTimer').innerHTML = str;
        }, 1000
    );
}

试试这个。

当你超过目标时间时,我没有做任何事情,我只是增加目标时间以指向不同的一天(主要区别是函数开头的if.else-if语句)

function countDown() {
    var now = new Date();
    var target = 15; // 15:00hrs is the cut-off point
    if (now.getDay() == 0) { // Sunday - use tomorrow's cutoff
        target += 24;
    } else if (now.getDay() == 6) { // Saturday - use cutoff 2 days from now
        target += 48;
    } else if (now.getHours() < target) { // missed the cutoff point. Use tomorrow instead
        target += 24;
        if (now.getDay() == 5) { // Friday - use Monday cutoff
            target += 48;
        } 
    }
    var hrs = (target - 1) - now.getHours();
    if (hrs < 0)
        hrs = 0;
    var mins = 59 - now.getMinutes();
    if (mins < 0)
        mins = 0;
    var secs = 59 - now.getSeconds();
    if (secs < 0)
        secs = 0;
    var str = pad(hrs, 2) + ':' + pad(mins, 2) + '.<small>' + pad(secs, 2) + '</small>';
    document.getElementById('countdownTimer').innerHTML = str;
}, 1000);

我拨弄小提琴:http://jsfiddle.net/4vhah8yt/1/

Code@sEver很好。Aj Richardson你的代码倒计时是从新的时间开始的,这是错误的。

我想affter倒计时隐藏HTML/CSS代码。

完整代码:https://codepen.io/kamikstudio/pen/dyzvrQP

if (document.getElementById('countdownTimer')) {
pad = function(n, len) { // leading 0's
    var s = n.toString();
    return (new Array( (len - s.length + 1) ).join('0')) + s;
};
var timerRunning = setInterval(
    function countDown() {
        var target = 14; // 15:00hrs is the cut-off point
        var now = new Date();
        //Put this in a variable for convenience
        var weekday = now.getDay();
        if(weekday == 0){//Sunday? Add 24hrs
            target += 24;
        }
        if(weekday == 6){//It's Saturday? Add 48hrs
            target += 48;
        }
        //If between Monday and Friday, 
        //check if we're past the target hours, 
        //and if we are, abort.
        if((weekday>=1) && (weekday<=5)){
            if (now.getHours() > target) { //stop the clock
                return 0;
            }                
        }
        var hrs = (target - 1) - now.getHours();
        if (hrs < 0) hrs = 0;
        var mins = 59 - now.getMinutes();
        if (mins < 0) mins = 0;
        var secs = 59 - now.getSeconds();
        if (secs < 0) secs = 0;
        var str = '<b>' + pad(hrs, 2) + ' </b>hours<b> ' + pad(mins, 2) + ' </b>min<b> ' + pad(secs, 2) + ' </b>sec';
        document.getElementById('countdownTimer').innerHTML = str;
    }, 1000
);

}