当元素滚动到页面顶部时，动态更改元素值

Question

我有按日期排序的项目列表，我希望日期在用户滚动到元素上方时在侧面保持固定，以便用户始终知道元素的日期。

我的html看起来像这样：

<div class="event_date">Jan 1, 2012</div>
<div> stuff here </div>
<div> stuff here </div>
<div class="event_date">Jan 2, 2012</div>
<div> stuff here </div>
<div> stuff here </div>
<div class="event_date">Jan 3, 2012</div>
<div> stuff here </div>
...

我已经有一个固定的div框，当用户在页面上滚动时，该框不会移动

<div id="current_date_box"></div>

我当前的Javascript如下所示：

$(window).scroll(function(){
    if ($(".event_date").offset().top < $(window).scrollTop()) {
        //the code only affects the first element with class event_date
        var selected_date = $(".event_date).html();
        $("#current_date_box").html(selected_date);
    }
});

滚动效果很好，但我可以滚动更改数据，但是问题是，因为我使用的是类选择器，所以它始终只从类列表中选择第一个元素。我不确定如何使它与页面上的每个类元素一起使用，并且我不能给它们提供每个唯一的ID，因为假设它是从日历数据库中提取的，因此可能存在无限的数量，我认为这是不实际的。

我也试图使其与eq[i]等配合使用，但我也无法弄清楚。我也尝试了各种使用$(this)的方法，但无济于事，但也许我实现错误。

我想我必须按照]的方针做些事情>

$(".event_date").offset().change() do something
但是不支持offset().change()。 

任何帮助将不胜感激！

我有按日期排序的项目列表，我希望日期在用户滚动到元素上方时在侧面保持固定，以便用户始终知道元素的日期。我的html看起来...

Answer 1

类选择器应返回所有匹配元素的集合。但是，您必须将其包装在每个函数中，我认为...