Question

我正在使用jquery动态创建某些表行，我想在几秒钟内显示之前创建的表行，我尝试了以下代码

var currenttime = moment();
$(".tbody").append("<tr><td class='tdata' data-id='"+currenttime+"'>0 seconds</td></tr>");


setInterval(function(){ 
var latest = moment();
var oldtime = $(".tdata").data("id");
var newtime = oldtime-latest;
$(".tdata").html(newtime+ "secs");
}, 3000);

所以基本上，我在创建行时会存储当前时间，然后随机检查并显示总秒数（而不是分钟或小时），如果5分钟，它将显示300。

我后来尝试了var = moment（）; ，但是它创建了对象，但我无法将其存储在data-attribute中，即使它可以在没有momentjs的情况下完成，也很不错，请提出任何想法，谢谢您。

Answer 1

您不需要在这里停留时间，而只需Date（getTime()方法）

var currenttime = new Date().getTime(); // Count milliseconds since 1970
$(".tbody").append("<tr><td class='tdata' data-id='"+currenttime+"'>0 seconds</td></tr>");


setInterval(function(){ 
  var oldtime = parseInt($(".tdata").data("id")); // HTML store it as String, don't forget to transform it to int "14254782000" > 14254782000
  var seconds = parseInt((new Date().getTime() - oldtime) / 1000);
  $(".tdata").html(seconds+ " secs");
}, 1000);

这样，您不会存储一个矩对象，而是存储了几秒（int），而且它始终是Now-Past（而不是Past-Now），因为Now高于Past（并且我们想要一个正值）。

Answer 2

不知道该示例的解释：

$("button").on("click", function(){
  $("tbody").append("<tr><td class='tdata'><span data-seconds-since=" + Date.now() + ">0</span> seconds</td></tr>");
});

// updates all places at once
setInterval(function(){ 
  var now = Date.now();
  $("[data-seconds-since]").text(function(){
    return ((now - this.dataset.secondsSince) / 1000).toFixed(1)
  });
}, 40);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<table><tbody></tbody></table>

<button type="button">Add Row</button>

Answer 3

变化不大

var starts = Date.now();
//...
var diff = (Date.now() - starts) / 10000;

您还可以检查moment.duration，因为您已经在使用momentJS。

两个时间戳之间的时差（以秒为单位）

3 个答案: