jQuery 航路点未在第一项上触发

Question

我正在使用 waypoint.js检测何时确定 <div> s 滚动过去，当它们滚动时更改导航类。这是我的 HTML:

<div class="section" id="section1">
  Some text
</div>
<div class="section" id="section1">
  More text
</div>

<ul id="nav">
  <li><a href="#" id="trigger1">Go to section 1</a></li>
  <li><a href="#" id="trigger2">Go to section 2</a></li>
</ul>

这里是 jQuery:

$('.section').waypoint(function(){

    var id = $(this).attr('id').replace('section','');
    $('ul#nav li a').removeClass('current');
    $('#trigger'+id).addClass('current');

});

这有效，向下和向上滚动，除了当我向右滚动回到顶部时，第二个菜单项仍然突出显示(仍然有 current 类)，而返回顶部应该 突出显示第一个菜单项。知道我做错了什么吗？

谢谢。

Answer 1

你有两次 id="section1"也许这会导致问题？