javascript - 将每个里给出的时间与当前时间进行比较

Question

这是关于什么的？

我正在尝试检查当前时间是否小于或等于特定范围内给定的时间

<小时/>

问题是什么？

我想在不刷新页面的情况下为每个li设置计时器，以检查时间是否等于当前时间，或者跨度中给出的时间与当前时间相比小于2秒。我不确定检查个人 li 的良好做法是什么？

<小时/>

HTML

<ul>
    <li>
        <span class="hidden time">December 3 2015 21:58:00 UTC-0800</span>
    </li>
    <li>
        <span class="hidden time">December 12 2015 15:00:00 UTC-0800</span>
    </li>
</ul>

Answer 1

一个计数器就可以了。您希望将间隔设置为小于 2 秒，并在每个间隔使用 jQuery .filter() 方法来查看是否有任何时间范围满足条件，然后添加类。

$(function() {
    var timer = setInterval(function() {
        var ts = Date.now();
        $('.current').text( new Date(ts) );
        $('ul > li > .hidden.time').filter(function() {
            var thisTime = new Date( $(this).text().trim() );
            return thisTime - ts <= 2000;
        })
        .addClass('active');
    }, 1000);
});

.active {
    background: black;
    color: yellow;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div>
  Current Time: <span class="current"></span>
</div>
<ul>
    <li>
        <span class="hidden time">December 3 2015 21:58:00 UTC-0800</span>
    </li>
    <li>
        <span class="hidden time">December 12 2015 15:00:00 UTC-0800</span>
    </li>
</ul>