カウントダウンを開始するには

Question

この作品を作るためのアイデアは？

私が作っている仕事用ボードでいくつかのタスクのカウントダウンを始めましたが、コードは機能しません。

任意の助けをいただければ幸いです:)

<div data-bind="value: function llogarit(due_date){ 
    var data = due_date; 
var countDownDate = new Date(data).getTime(), 
    countdownfunction = setInterval(function() { 
     var e = (new Date).getTime(), 
      n = countDownDate - e, 
      t = Math.floor(n/864e5), 
      o = Math.floor(n % 864e5/36e5), 
      a = Math.floor(n % 36e5/6e4), 
      r = Math.floor(n % 6e4/1e3); 
    console.log(e); 
    } "> 

Answer 1

あなたはknockoutjsをタグ付けしましたので、私はノックアウトエラーに焦点を当てます：

• あなたが結合valueを使用していますサポートされていない<div>にあります。代わりにtextバインディングを使用してください。
• バインディングに渡されたjavascriptに構文エラーがあり、バインドのinitメソッドがエラーをスローします。
• あなたが渡す機能はreturnなので、knockoutはHTMLを挿入することはできません。
• 渡されたjavascriptにはobservableの値が含まれていないため、knockoutには最新のものを保持する仕組みがありません。

、これらの問題を解決するのviewmodelの内側にきちんとロジックを置くために私の提案：それはshows-

// Ticker returns an observable time integer 
 
// that is updated on a fixed `interval` 
 
var Ticker = function(interval) { 
 
    var obsNow = ko.observable(Date.now()); 
 

 
    setInterval(
 
    function() { 
 
     obsNow(Date.now()); 
 
    }, 
 
    interval 
 
); 
 

 
    return obsNow; 
 
}; 
 

 
var CountDown = function(to) { 
 
    // CountDown creates its own ticker that triggers 
 
    // an update every 1000ms 
 
    // Note: if you plan to dispose the instance, make 
 
    //  sure you implement a disposal mechanism 
 
    //  for the ticker as well 
 
    var currentTime = Ticker(1000); 
 

 
    // Counter formats a time difference in to a neat string 
 
    // that can be used in your view 
 
    this.counter = ko.pureComputed(function() { 
 
    // By referencing the observable time integer, 
 
    // we ensure automatic updates 
 
    var e = currentTime(), 
 
     n = to - e, 
 
     t = Math.floor(n/864e5), 
 
     o = Math.floor(n % 864e5/36e5), 
 
     a = Math.floor(n % 36e5/6e4), 
 
     r = Math.floor(n % 6e4/1e3); 
 

 
    // Note: this logic might better be defined in 
 
    //  several steps, or even in the view. 
 
    return t + "d, " + [o, a, r].map(l2).join(":"); 
 
    }); 
 
}; 
 

 
// Count down to 2 days from now 
 
ko.applyBindings(new CountDown(Date.now() + 2 * 24 * 60 * 60 * 1000)); 
 

 
// Left pad numbers to a min. length of 2 (1 -> "01") 
 
function l2(x) { 
 
    return (x < 10 ? "0" : "") + x; 
 
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script> 
 

 
<div data-bind="text: counter"></div>

Answer 2

Javascriptがあなたが上記したコードではないが完了していないようです：

setInterval(function() { 
    var e = (new Date).getTime(), 
     n = countDownDate - e, 
     t = Math.floor(n/864e5), 
     o = Math.floor(n % 864e5/36e5), 
     a = Math.floor(n % 36e5/6e4), 
     r = Math.floor(n % 6e4/1e3); 
    console.log(e); 
} 

は、実際にmillisecondsパラメータが欠落しています。

setInterval関数の説明については、this pageを参照してください。

ほとんどの場合、これは文法的に正しいようになります。

setInterval(function() { 
    var e = (new Date).getTime(), 
     n = countDownDate - e, 
     t = Math.floor(n/864e5), 
     o = Math.floor(n % 864e5/36e5), 
     a = Math.floor(n % 36e5/6e4), 
     r = Math.floor(n % 6e4/1e3); 
    console.log(e); 
}, 3000);