根据变量值在 div 处启动容器答案

【问题标题】：Start container at a div depending on variable value根据变量值在 div 处启动容器
【发布时间】：2014-11-21 17:10:09
【问题描述】：

我已设置应在当前时间开始的电视指南。我正在使用以下 Div 来执行此操作，直到凌晨 24 点为止。时间栏水平滚动。

<div class="timeListContainer">
    <div class="timeList">
        <div class='timeCell' id="1">
            1am
        </div>
        <div class='timeCell' id="2">
            2am
        </div>
    </div>
</div>

我用来执行此操作的脚本只是滚动了一下，因为它没有看到 ID。有谁知道如何更改我的代码，以便在下午 5 点（17 点）时间列表从 id 17 开始？我对此进行了研究并在某些地方尝试了 .attr('id') ，但我无法使其正常工作。脚本如下：

$(document).ready(function () {

var dt = new Date();
var time = dt.getHours();


var myDiv = $('.timeCell').filter(function() {
    return $(this).text().indexOf(time) ;
});


$('.timeListContainer').animate({
    scrollLeft: myDiv.offset().left
}, 2000);

});

【问题讨论】：

我可以将它们更改为 1、2、3 或 0100、0200、0300 等，但仍不确定如何读取？

标签： jquery html class time scroll

【解决方案1】：

一种方法是结合使用data-* 属性和属性选择器

<div class="timeCell" data-time="1">
   1am
</div>
<div class="timeCell" data-time="2">
   2am
</div>

然后选择合适的：

var myDiv = $('.timeCell[data-time="' + time + '"]')

（您可以使用当前的 id 属性来执行此操作，但数据属性有点更多 html5-ey）

另一种方法是保留您当前的结构并按id 过滤

var myDiv = $('.timeCell').filter(function() {
    return this.id == time
});

【讨论】：