javascript - 倒计时计时器未在动态创建的元素内更新
问题描述
倒计时计时器未在动态创建的元素内更新。我正在尝试在 ajax 成功后创建的 td 内倒计时。我将当前服务器时间存储在一个变量中。它在 1000 毫秒后不更新。
这是代码:
var server_time=`<?php
date_default_timezone_set('Asia/Kolkata');
echo date("Y-m-d h:i:s");
?>`;
$.ajax({
url:'/getCampaigns',
type:'post',
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
},
success:function(response){
$.each(response,function(index,element){
$('.append_data').append(`<tr><td>${element.id}</td>
<td><a href='/campaign-report?campaign_id=${element.id}'>${element.campaign_name}</a></td>
<td>${element.total_numbers}</td>
<td id="countdown_${element.id}"></td>
<td>${element.start_time}</td>
</tr>`);
/** Countdown Start *****/
if(element.status=="Scheduled")
{
var countDownDate = new Date(`${element.start_time}`).getTime();
var x = setInterval(function() {
// Get todays date and time
var now = new Date(`${server_time}`).getTime();
// Find the distance between now and the count down date
var distance = countDownDate - now;
// Time calculations for days, hours, minutes and seconds
var days = Math.floor(distance / (1000 * 60 * 60 * 24));
var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
var seconds = Math.floor((distance % (1000 * 60)) / 1000);
// Display the result in the element with id="demo"
$("#countdown_"+element.id).html(days + "d " + hours + "h "
+ minutes + "m " + seconds + "s ");
// If the count down is finished, write some text
if (distance < 0) {
clearInterval(x);
document.getElementById("countdown_"+element.id).innerHTML="Started";
}
}, 1000);
}
解决方案
现在它正在工作。我删除了 php 代码并使用了 js new Date();
推荐阅读
- c++ - HDF5 简单读取数据集失败
- javascript - 显示一定时间后如何隐藏或删除消息?
- python - 已部署 GAE NDB 安装
- javascript - Moment.js:将持续时间分割为年、月、周、日等
- javascript - d3.js:渐变填充是轮廓,如何使它变得立体?
- android - 使用 Surfaceview 尺寸调整相机视图
- google-pay - 使用 3ds 在网络上支付 Google Pay
- wordpress - WPForms:如何通过某些 Url 参数值在下拉列表中设置默认值
- javascript - NetSuite Javascript 错误:org.mozilla.javascript.Undefined@26e0a9d9
- java - 比较大型列表并提取缺失数据