Question

目前我正在使用jquery倒计时器插件(This Plugin)来通过Ajax调用生成Counter。
现在它的工作正常，单个调用没有问题但是当我试图通过Json数组生成多个计数器整个循环时，它不起作用。
JS

$(document).ready(function(){ 
                    $.ajax({
                        url: 'time.php', 
                        async: false, 
                        dataType: 'json', 
                        success: function(data) { 
                            var response = data ;
                            $.each(response, function(i, item) {
                                var time = new Date(item.time) ;
                                $('.timer').append('<li id='+ i +'></li>');
                                 $('#'+i).countdown({
                                 until: time, 
                                 compact: true,
                                 format: 'HMS'
                             });  
                            });
                        }, 
                        error: function(http, message, exc) { 
                            time = new Date(); 
                    }
                }
            ); 


            })

PHP

<?php
  $now = time() + 9999; 
  $now1 = time()+ 5000; 
  $data = array($now,$now1);
  $json = array();
  foreach ($data as $value){
      $json[] = array(
          'time' => $value
      );
  }
  echo json_encode($json);
 ?>

这是Json输出

[{"time":1365712506},{"time":1365707507}]

当我试图显示循环结果而没有设置时间时它工作正常并显示正确的结果但是在设置时间并设置倒计时器后，它显示00而不是计数器

    00:00:00
    00:00:00

Answer 1

您需要将日期乘以1000

var time = new Date(item.time*1000);

我还将类更改为ID，并为非html5浏览器的LI的iD添加了一个字母

DEMO

$(function(){ 
  var response = [{"time":1365712506},{"time":1365707507}];
  $.each(response, function(i, item) {
    var time = new Date(item.time*1000) ;
    $('#timer').append('<li id="t'+ i +'"></li>');
    $('#t'+i).countdown({
      until: time, 
      compact: true,
      format: 'HMS'
    });  
  });
});

Answer 2

你需要查看你的日期，我不相信它们是将来的。

console.log(time);

Fiddle

循环通过JSON数组生成多个倒计时器？

2 个答案: