倒計時jquery

我有jQuery問題，我使用下面的代碼來獲取日期格式json，這段代碼工作正常。倒計時jquery

在執行console.log（時代報）我可以看到這個日期

2015/11/21 12:34:56 
ex.html:15 2016/10/10 12:34:56 
ex.html:15 2017/10/10 12:34:56 
ex.html:15 2018/10/10 12:34:56 
ex.html:15 2019/10/10 12:34:56

然而，在HTML我只看到我從JSON收到的第一次約會。

<script type="text/javascript"> 
    function tiempo(tiempo){ 
     console.log(tiempo); 
     $('.clock').countdown(tiempo, function(event) { 
      $(this).html(event.strftime('%D days %H:%M:%S')); 
     }); 
    }  
</script> 
<script type="text/javascript"> 
    var arr = [ 
     {"transporte":"Servei de Rodalies Barcelona","now":"2015/11/21 12:34:56"}, 
     {"transporte":"Serveis Regionals","now":"2016/10/10 12:34:56"}, 
     {"transporte":"Ferrocarrils","now":"2017/10/10 12:34:56"}, 
     {"transporte":"Metro","now":"2018/10/10 12:34:56"}, 
     {"transporte":"Tram","now":"2019/10/10 12:34:56"} 
    ]; 
    jQuery.each(arr, function(index, value) { 
     $(".prueba").append('<div class="clock"></div>'); 
     tiempo(value.now); 
    }); 
</script>

圖像更好解釋。

UPDATE

Wihich這段代碼中，只顯示一個日期

<body> 
    <div class="clock"></div> 
</body> 

<script type="text/javascript"> 
    function tiempo(tiempo){ 
     $('.clock').countdown(tiempo, function(event) { 
      $(this).html(event.strftime('%D days %H:%M:%S')); 
     }); 
    }  
</script> 
<script type="text/javascript"> 
    var arr = [ 
     {"transporte":"Servei de Rodalies Barcelona","now":"2015/11/21 12:34:56"}, 
     {"transporte":"Serveis Regionals","now":"2016/10/10 12:34:56"}, 
     {"transporte":"Ferrocarrils","now":"2017/10/10 12:34:56"}, 
     {"transporte":"Metro","now":"2018/10/10 12:34:56"}, 
     {"transporte":"Tram","now":"2019/10/10 12:34:56"} 
    ]; 
    for (var i = 0 ; i < arr.length ; ++i) { 
     tiempo(arr[i].now); 
    } 
</script>

來源

2015-11-20 jc1992

是什麼的_countdown_功能嗎？它是一個'jquery'插件嗎？ –

問題是與這段代碼（具體的選擇：.clock）：

$('.clock').countdown(tiempo, function(event) { 
    $(this).html(event.strftime('%D days %H:%M:%S')); 
});

什麼，你在這裏做與類clock，不只是你創建的最後一個設置所有div元素的值。

有一些你的問題的解決方案，但需要改變的最低金額是使用jquery功能last像這樣（挑選從集合的最後一個元素）的一個：

$('.clock').last().countdown(tiempo, function(event) { 
    $(this).html(event.strftime('%D days %H:%M:%S')); 
});

來源

2015-11-20 09:25:45

您可以使用標準的for遍歷對象進行迭代：

var arr = [ 
    {"transporte":"Servei de Rodalies Barcelona","now":"2015/11/21 12:34:56"}, 
    {"transporte":"Serveis Regionals","now":"2016/10/10 12:34:56"}, 
    {"transporte":"Ferrocarrils","now":"2017/10/10 12:34:56"}, 
    {"transporte":"Metro","now":"2018/10/10 12:34:56"}, 
    {"transporte":"Tram","now":"2019/10/10 12:34:56"} 
]; 
for (var i = 0 ; i < arr.length ; ++i) { 
    console.log(arr[i].now); 
    $(".prueba").append('<div class="clock"></div>'); 
    tiempo(value.now); 
}

來源

2015-11-20 08:43:38 jaggedsoft

這個代碼我只能顯示一個日期:( – jc1992

請確保你在那裏扔''''$（「.prueba」）.append（'

'）;''''通過向您展示如何迭代對象來爲您指出正確的方向 – jaggedsoft

@jcsa示例已更新 – jaggedsoft

將此：

for (var i = 0; i < arr.length; ++i) { 
    var element = $('<div class="clock"></div>').html(tiempo(value.now)); 
    $(".prueba").append(element); 
}

而這一切

來源

2015-11-20 09:26:38

回答

相關問題