javascript - 简单的多秒倒计时

Question

我有几个 <span class="timer">342</span>不同的值（秒）。我想倒计时所有这些，并认为我可以做类似的事情：

            $('.timer').ready(function() {
                timer = setInterval(function() {
                    sec = $('.timer').text();
                    $('.timer').text(--sec);
                    if (sec == 0) {
                        clearInterval(timer);
                        location.href = 'accounts.php';
                    }
                }, 1000);
            });

错误是，Javascript 会因为超过 1 个对象.timer或其他东西而感到困惑，并为跨度生成奇怪的值。

当第一个计时器达到零时，它应该重新加载。使用 jQuery。跨度数不固定。我真的很想保持简单，不要使用额外的插件或大脚本文件。

Answer 1

.ready仅用于document和 标记 DOM 完全解析时的点。在这个函数中，this指的是文档。我会用另一种方式写它：

$(document).ready(function() {

    timer = setInterval(function() {
        $('.timer').each(function(){
            var $this = $(this);
            var countdown = parseInt($this.text()) - 1;

            $this.text(countdown);
            if (countdown == 0) {
                clearInterval(timer);
                location.href = 'accounts.php';
            }
        });
    }, 1000);
});

重要的：

1. 用于.each遍历每个计时器
2. 用于parseInt从字符串中获取整数

这是一个Example-Fiddle有效的方法。

Answer 2

我自己得到了。这真的有效（小提琴）：

            timer = setInterval(function() {
                $('.timer').each(function(index, el) {
                    sec = $(el).text();
                    $(el).text(--sec);
                    if (sec == 0) {
                        location.href = 'accounts.php';
                    }
                });
            }, 1000);