Wie starte ich den Countdown

Question

irgendwelche Ideen, damit das funktioniert?

Ich begann einen Countdown für einige Aufgaben in einem Job-Boards, die ich mache, aber der Code funktioniert nicht.

Jede Hilfe würde geschätzt :)

<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

Da Sie knockoutjs mit Tags versehen haben, werde ich den Schwerpunkt auf die Ko-Fehler:

• Sie verwenden die value Bindung auf einem <div>, der nicht unterstützt wird. Verwenden Sie stattdessen die text Bindung.
• Das an die Bindung übergebene JavaScript hat einen Syntaxfehler, der dazu führt, dass die Methode init der Bindung einen Fehler auslöst.
• Die Funktion, die Sie übergeben, tut nichts return irgendetwas, also knockout ist nicht in der Lage, irgendein HTML zu spritzen.
• Das übergebene JavaScript enthält keinen observable Wert, also hat Knockout keinen Mechanismus, um Dinge auf dem neuesten Stand zu halten.

Mein Vorschlag, diese Probleme zu beheben, die Logik ordentlich in einem Ansichtsmodell setzen:

// 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

die Javascript-Code nicht Sie oben haben, nicht vollständig zu sein scheinen:

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); 
} 

tatsächlich die milliseconds Parameter fehlen.

Siehe Dokumentation this page für die Funktion setInterval.

Höchstwahrscheinlich wird dies syntaktisch korrekt sein:

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);