Warning: file_get_contents(/data/phpspider/zhask/data//catemap/6/codeigniter/3.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
JavaScript计时器在多个实例上不工作_Javascript_Php_Jquery - Fatal编程技术网

JavaScript计时器在多个实例上不工作

JavaScript计时器在多个实例上不工作,javascript,php,jquery,Javascript,Php,Jquery,下面是一个循环的结果,我想运行计时器来计算每个循环结果的设置时间 <span id="time" data-time="{{ $user->created_at->addHours(config('app.timer')) }}" data-url="{{ url('/TimePay/'.$user->id)}}"></span> <span id="time" data-time="{{ $user->created_at->add

下面是一个循环的结果,我想运行计时器来计算每个循环结果的设置时间

<span id="time" data-time="{{ $user->created_at->addHours(config('app.timer')) }}" data-url="{{ url('/TimePay/'.$user->id)}}"></span>

<span id="time" data-time="{{ $user->created_at->addHours(config('app.timer')) }}" data-url="{{ url('/TimePay/'.$user->id)}}"></span>

<span id="time" data-time="{{ $user->created_at->addHours(config('app.timer')) }}" data-url="{{ url('/TimePay/'.$user->id)}}"></span>

计时器脚本:

$(document).ready(function(){

  $('[data-time]').each(function() {
    console.log($(this))
    var $this = $(this),
      finalTime = $(this).data('time'),
      url       = $(this).data('url')

    // Set the date we're counting down to
    var countDownDate = new Date(finalTime).getTime();

    // Update the count down every 1 second
    var x = setInterval(function() {

      // Get todays date and time
      var now = new Date().getTime();

      // Find the distance between now an 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 an element with id="demo"
      document.getElementById("time").innerHTML = days + "d " + hours + "h " + minutes + "m " + seconds + "s ";

      // If the count down is finished, write some text
      if (distance < 0) {
        clearInterval(x);
        document.getElementById("time").innerHTML = "EXPIRED";
      }
    }, 1000);
  })
})
$(文档).ready(函数(){
$(“[数据时间]”)。每个(函数(){
console.log($(this))
变量$this=$(this),
finalTime=$(this).data('time'),
url=$(this.data('url'))
//确定我们倒计时的日期
var countDownDate=新日期(finalTime).getTime();
//每1秒更新一次倒计时
var x=setInterval(函数(){
//获取今天的日期和时间
var now=new Date().getTime();
//找出现在和倒计时日期之间的距离
var距离=倒计时日期-现在;
//天、小时、分钟和秒的时间计算
变量天数=数学楼层(距离/(1000*60*60*24));
可变小时数=数学楼层((距离%(1000*60*60*24))/(1000*60*60));
var分钟=数学楼层((距离%(1000*60*60))/(1000*60));
var秒=数学楼层((距离%(1000*60))/1000);
//在id为“demo”的元素中显示结果
document.getElementById(“time”).innerHTML=days+“d”+hours+“h”+minutes+“m”+seconds+“s”;
//如果倒计时结束,写一些文字
如果(距离<0){
净间隔(x);
document.getElementById(“time”).innerHTML=“过期”;
}
}, 1000);
})
})
因此,我使用Laravel和jQuery来运行计时器

我需要代码方面的帮助,因为它不起作用。

诀窍是在数组中“保存”间隔。
如果不这样做,它将在每次循环迭代中被覆盖

然后,要引用右侧的
span
元素,您必须获得迭代
索引
,以便以后在
.eq()
方法中使用。
不能在循环中使用
id
,因为它必须是唯一的

看看代码中的注释

$(文档).ready(函数(){
//用于存储创建的间隔的数组。
var timerArray=[];
$(“[数据时间]”)。每个(函数(索引){
log($(this.data(“time”));
var finalTime=$(this.data('time');
//确定我们倒计时的日期
var countDownDate=新日期(finalTime).getTime();
//每1秒更新一次倒计时
var x=setInterval(函数(){
//此索引将用于引用正确的跨度。
var thisIndex=指数;
控制台日志(“间隔”+此索引);
//获取今天的日期和时间
var now=new Date().getTime();
//找出现在和倒计时日期之间的距离
var距离=倒计时日期-现在;
//天、小时、分钟和秒的时间计算
变量天数=数学楼层(距离/(1000*60*60*24));
可变小时数=数学楼层((距离%(1000*60*60*24))/(1000*60*60));
var分钟=数学楼层((距离%(1000*60*60))/(1000*60));
var秒=数学楼层((距离%(1000*60))/1000);
//前导零。。。
如果(小时)诀窍是在数组中“保存”间隔。
如果不这样做,它将在每次循环迭代中被覆盖

然后,要引用右侧的
span
元素,您必须获得迭代
索引
,以便以后在
.eq()
方法中使用。
不能在循环中使用
id
,因为它必须是唯一的

看看代码中的注释

$(文档).ready(函数(){
//用于存储创建的间隔的数组。
var timerArray=[];
$(“[数据时间]”)。每个(函数(索引){
log($(this.data(“time”));
var finalTime=$(this.data('time');
//确定我们倒计时的日期
var countDownDate=新日期(finalTime).getTime();
//每1秒更新一次倒计时
var x=setInterval(函数(){
//此索引将用于引用正确的跨度。
var thisIndex=指数;
控制台日志(“间隔”+此索引);
//获取今天的日期和时间
var now=new Date().getTime();
//找出现在和倒计时日期之间的距离
var距离=倒计时日期-现在;
//天、小时、分钟和秒的时间计算
变量天数=数学楼层(距离/(1000*60*60*24));
可变小时数=数学楼层((距离%(1000*60*60*24))/(1000*60*60));
var分钟=数学楼层((距离%(1000*60*60))/(1000*60));
var秒=数学楼层((距离%(1000*60))/1000);
//前导零。。。

如果(小时1-一个
id
必须是唯一的…不能多次使用相同的时间。2-用于存储间隔的
x
变量在每次循环迭代时被覆盖。1-一个
id
必须是唯一的…不能多次使用相同的时间。2-用于存储间隔的
x
变量在每次循环迭代时被覆盖非常感谢你让我从压力中解脱出来我想报答你非常感谢你让我从压力中解脱出来我想报答你。