将倒数计时器添加到Javascript第二天交付截止倒数

Question

我有第二天的交货倒计时JS。它可以正确显示小时和分钟并实时更新，但我也想添加一秒钟的倒计时。

我尝试在JS和代码中添加“秒”，但是它仅显示总计的秒数。例如1440秒，即24分钟。

任何帮助将不胜感激。

这是显示倒计时的代码。

<script src="//code.jquery.com/jquery-2.2.4.min.js"></script>

<script src="{{ 'delivery-countdown.js' | asset_url }}"></script>
<!-- Countdown timer for a product -->
<div class="product-item">
    <div class="countdown">
      Order <span class="countdown_time countdown_time--time" style="display: none;">in the next <strong><span class="countdown__hours"></span> hrs <span class="countdown__minutes"></span> mins </strong></span><span class="countdown_time countdown_time--soon">soon</span><span class="countdown_time countdown_time--by" style="display: none;">by <span class="countdown__dispatch_date"></span><br /></span> to receive it on <strong><span class="countdown__delivery_day"></span></strong>* (when selecting Next Day Delivery at the checkout)
    </div>
</div>

<!-- Required script -->
<script type="text/javascript">
    jQuery(document).ready(
        function () {
            var days = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
            var months = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
            var dispatch_days = [0,1, 2, 3, 4, 5];
            var delivery_days = [1, 2, 3, 4, 5,6];
            var exclusion_dispatch_dates = [
                new Date("12/25/2013 00:00:00"),
                new Date("12/26/2013 00:00:00"),
                new Date("01/01/2014 00:00:00"),
                new Date("04/18/2014 00:00:00")
            ];
            var exclusion_delivery_dates = exclusion_dispatch_dates;

            var countdown_args = {
                "cutoff_hour": 14,
                "cutoff_minute": 00,
                "lead_time_days": 1,
                "dispatch_days": dispatch_days,
                "delivery_days": delivery_days,
                "exclusion_dispatch": exclusion_dispatch_dates,
                "exclusion_delivery": exclusion_delivery_dates,
                "actual_time": new Date()
            }
            var countdown = new Delivery_Countdown(countdown_args);
            countdown.init();

            var countdown_element = $(".product-item").find('.countdown');

            if (countdown.countdown_hours >= 24) {
                countdown_element.find('.countdown_time--time').css('display', 'none');
                countdown_element.find('.countdown_time--soon').css('display', 'none');
                countdown_element.find('.countdown_time--by').css('display', 'inline');
            }
            else {
                countdown_element.find('.countdown_time--soon').css('display', 'none');
                countdown_element.find('.countdown_time--time').css('display', 'inline');
                countdown_element.find('.countdown_time--by').css('display', 'none');
            }

            countdown_element.find('.countdown__hours').text(countdown.countdown_hours);
            countdown_element.find('.countdown__minutes').text(countdown.countdown_minutes);
            countdown_element.find('.countdown__dispatch_date').text((countdown.dispatch.getHours() - 12) + "pm " + days[countdown.dispatch.getDay()]);
            countdown_element.find('.countdown__delivery_day').text(days[countdown.delivery.getDay()] + " " + countdown.delivery.getDate() + " " + months[countdown.delivery.getMonth()] + " " + countdown.delivery.getFullYear());

            setInterval(
                function ()
                {
                    if (countdown.is_valid())
                    {
                        countdown.update();
                    }
                    else
                    {
                        countdown.init();
                    }

                    if (countdown.countdown_hours >= 24)
                    {
                        countdown_element.find('.countdown_time--time').css('display', 'none');
                        countdown_element.find('.countdown_time--soon').css('display', 'none');
                        countdown_element.find('.countdown_time--by').css('display', 'inline');
                    }
                    else
                    {
                        countdown_element.find('.countdown_time--soon').css('display', 'none');
                        countdown_element.find('.countdown_time--time').css('display', 'inline');
                        countdown_element.find('.countdown_time--by').css('display', 'none');
                    }

                    countdown_element.find('.countdown__hours').text(countdown.countdown_hours);
                    countdown_element.find('.countdown__minutes').text(countdown.countdown_minutes);
                    countdown_element.find('.countdown__dispatch_date').text((countdown.dispatch.getHours() - 12) + "pm " + days[countdown.dispatch.getDay()]);
                    countdown_element.find('.countdown__delivery_day').text(days[countdown.delivery.getDay()] + " " + countdown.delivery.getDate() + " " + months[countdown.delivery.getMonth()] + " " + countdown.delivery.getFullYear());
                },
                (1000 * 60)
            );
        }
    );
</script>

这是JS代码。

function Delivery_Countdown(args) {

    this.dispatch = false;
    this.delivery = false;
    this.time_to_cutoff = false;
    this.countdown_hours = false;
    this.countdown_minutes = false;
    this.cutoff_hour = args.cutoff_hour;
    this.cutoff_minute = args.cutoff_minute;
    this.lead_time_days = args.lead_time_days;

    this.dispatch_days = args.dispatch_days;
    this.delivery_days = args.delivery_days;

    // exclusion dates
    this.exclusion_dispatch = args.exclusion_dispatch;
    this.exclusion_delivery = args.exclusion_delivery;

    // Provide start time in args, then keep own time!
    this.actual_time = args.actual_time || new Date();
    this.actual_time_tick = function () {
        this.actual_time = new Date(this.actual_time.getTime() + (1000 * 60));
    }

    this.get_next_available_dispatch = function () {
        this.dispatch = false;
        // Today at cut off time is next possible if ordering before cut off time
        //var this_day = new Date();
        var this_day = new Date(this.actual_time.getTime());
        this_day.setHours(this.cutoff_hour);
        this_day.setMinutes(this.cutoff_minute);
        this_day.setSeconds(0);
        this_day.setMilliseconds(0);

        // Loop through proposing times until find a valid one in the future.
        while (this.dispatch == false) {

            // Check if proposed dispatch time (this_day) is not a Sunday or a Saturday and that 4pm is in future.
            if (this.get_is_dispatch_day(this_day.getDay()) == true && this.get_time_to_cutoff(this_day) > 0 && this.get_is_exclusion_dispatch_date(this_day) == false) {
                this.dispatch = this_day;
            }

            // Increment proposed dispatch day for next loop, assuming necessary.
            this_day = new Date(this_day.getTime() + (1000 * 60 * 60 * 24));

        }

        return this.dispatch;
    }

    this.get_next_available_delivery = function () {
        this.delivery = false;

        var lead_time_reached = false;

        // start looking the day after
        var this_day = new Date(this.dispatch.getTime() + (1000 * 60 * 60 * 24));
        this_day.setHours(0);
        this_day.setMinutes(0);
        this_day.setSeconds(0);
        this_day.setMilliseconds(1);

        var lead_time_count = 0;

        while (this.delivery == false) {
            if (this.get_is_delivery_day(this_day.getDay()) == true && this.get_is_exclusion_delivery_date(this_day) == false) {
                lead_time_count++;
                if (lead_time_count == this.lead_time_days) {
                    this.delivery = this_day;
                }
            }
            // Increment proposed delivery day for next loop, assuming necessary.
            this_day = new Date(this_day.getTime() + (1000 * 60 * 60 * 24));
        }

        return this.delivery;
    }

    this.get_time_to_cutoff = function (cutoff_datetime) {
        //var today = new Date();
        var today = this.actual_time;
        return (cutoff_datetime.getTime() - today.getTime());
    }

    this.is_valid = function () {
        if (this.get_time_to_cutoff(this.dispatch) > 0) {
            return true;
        }
        return false;
    }

    this.get_is_dispatch_day = function (day_index) {
        if (this.dispatch_days.length > 0) {
            for (var i = 0; i < this.dispatch_days.length; i++) {
                if (this.dispatch_days[i] == day_index) {
                    return true;
                }
            }
        }
        return false;
    }

    this.get_is_delivery_day = function (day_index) {
        if (this.delivery_days.length > 0) {
            for (var i = 0; i < this.delivery_days.length; i++) {
                if (this.delivery_days[i] == day_index) {
                    return true;
                }
            }
        }
        return false;
    }

    this.get_is_exclusion_dispatch_date = function (proposed_date) {
        var check_date = new Date(proposed_date.getTime());
        check_date.setHours(0);
        check_date.setMinutes(0);
        check_date.setSeconds(0);
        check_date.setMilliseconds(0);

        if (this.exclusion_dispatch.length > 0) {
            for (var i = 0; i < this.exclusion_dispatch.length; i++) {
                if (this.exclusion_dispatch[i].getTime() == check_date.getTime()) {
                    return true;
                }
            }
        }
        return false;
    }

    this.get_is_exclusion_delivery_date = function (proposed_date) {
        var check_date = new Date(proposed_date.getTime());
        check_date.setHours(0);
        check_date.setMinutes(0);
        check_date.setSeconds(0);
        check_date.setMilliseconds(0);

        if (this.exclusion_delivery.length > 0) {
            for (var i = 0; i < this.exclusion_delivery.length; i++) {
                if (this.exclusion_delivery[i].getTime() == check_date.getTime()) {
                    return true;
                }
            }
        }
        return false;
    }

    this.update = function () {
        this.actual_time_tick();
        this.time_left_to_order = this.get_time_to_cutoff(this.dispatch);
        this.countdown_hours = parseInt(this.time_left_to_order / 1000 / 60 / 60);
        this.countdown_minutes = parseInt((this.time_left_to_order / 1000 / 60) - (this.countdown_hours * 60));
    }

    this.init = function () {
        this.dispatch = this.get_next_available_dispatch();
        this.delivery = this.get_next_available_delivery();
        this.time_left_to_order = this.get_time_to_cutoff(this.dispatch);
        this.countdown_hours = parseInt(this.time_left_to_order / 1000 / 60 / 60);
        this.countdown_minutes = parseInt((this.time_left_to_order / 1000 / 60) - (this.countdown_hours * 60));
    }

}