javascript - Js setInterval 对于不同的段落不起作用

Question

我想为每个段落运行不同的计时器。但不幸的是，它是根据最后一段来工作的。该函数应针对每个段落单独运行。这是我的代码

$(".set_timer").each(function() {
  setTimer($(this).data("created_time"), $(this));
});

function setTimer(dateStart, ele) {
  countDownDate = new Date(dateStart).getTime();

  x = setInterval(function() {
    // Get todays date and time
    now = new Date().getTime();
    // Find the distance between now an the count down date
    distance = countDownDate - now;
    // Time calculations for days, hours, minutes and seconds
    days = Math.floor(distance / (1000 * 60 * 60 * 24));
    hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
    minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
    seconds = Math.floor((distance % (1000 * 60)) / 1000);

    // Output the result in an element with id="demo"
    ele.html(days + "d " + hours + "h " + minutes + "m " + seconds + "s ");
    // If the count down is over, write some text 
    if (distance < 0) {
      clearInterval(x);
      ele.html("TIMER COMPLETED");
    }
  }, 1000);
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
<p class="set_timer" data-created_time="May 12, 2018 11:56:30"></p>
<p class="set_timer" data-created_time="May 10, 2018 11:56:30"></p>
<p class="set_timer" data-created_time="May 08, 2018 11:56:30"></p>
<p class="set_timer" data-created_time="Apr 10, 2018 11:56:30"></p>
<p class="set_timer" data-created_time="Jun 15, 2018 11:56:30"></p>
<p class="set_timer" data-created_time="Jul 13, 2018 11:56:30"></p>

当前输出:

459d 1h 15m 25s

459d 1h 15m 25s

459d 1h 15m 25s

459d 1h 15m 25s

459d 1h 15m 25s

根据created_time data属性应该有所不同

Answer 1

只需将 var 添加到 countDownDate = new Date(dateStart).getTime();

原来如此

 var countDownDate = new Date(dateStart).getTime();
 .
 .
 .