javascript - jquery如何加载所有元素

Question

好的。我有不同的 span 并将其 id 属性设置为 Y-m-d 格式的日期。我正在使用倒计时 js 来计算每个跨度倒计时，但我的函数仅选择一个日期并将倒计时应用于它。它不会评估其他日期的倒计时。

<span class="timer" id="2017-10-1"></span>
<span class="timer" id="2017-10-2"></span>
<span class="timer" id="2017-10-3"></span>
<span class="timer" id="2017-10-4"></span>

这是倒计时jquery

http://hilios.github.io/jQuery.countdown/

以及我在函数中编写的内容。

$(document).ready(function () {
    var time = $(".timer").attr('id');
    var timeLeft = time.split('-').reverse().join('-');
    $(".timer").countdown(timeLeft, function (event) {
        $(this).text(event.strftime("%D days %H hours %M minutes %S seconds remaining"));
    });
});

Answer 1

.attr('key') 将仅获取第一个元素的值，因此 timeLeft 将根据第一个元素计算。

使用 .each() 迭代 $(".timer") 对象并在元素上单独应用插件 countdown()。

$(document).ready(function(){
    $(".timer").each(function(){
        var time = this.id;
        var timeLeft = time.split('-').reverse().join('-');
        $(this).countdown(timeLeft, function(event){
            $(this).text(event.strftime("%D days %H hours %M minutes %S seconds remaining"));
        });
    })
});