小时,分钟,秒,淘汰赛倒数计时器

Question

嗨,我想知道是否有人可以告诉我如何制作一个显示小时,分钟和秒的淘汰赛倒计时器

需要一个淘汰计时器的项目

Jeroen对小提琴的回答很棒,但它只显示秒.任何帮助,将不胜感激

谢谢

Answer 1

使用几个计算的可观察量.

HTML

<div id="timer">
    <span data-bind="text: hours"></span> hrs
    <span data-bind="text: minutes"></span> minutes
    <span data-bind="text: seconds"></span> seconds
</div>

JAVASCRIPT

function ViewModel() {
    var self = this;

    self.timer = ko.observable(4566);

    self.hours = ko.computed( function() {
        return Math.floor(self.timer() / 3600);
    }, self);

    self.minutes = ko.computed( function() {
        return Math.floor(self.timer() / 60) % 60;
    }, self);

    self.seconds = ko.computed( function() {
        return self.timer() % 60;
    }, self);


    setInterval(function() {
        var newTimer = self.timer() -1;
        self.timer(newTimer <= 0 ? 60 : newTimer);
    }, 1000);
};

ko.applyBindings(new ViewModel());