jQueryを使用してスクロール位置に依存するクラスを変更するのに問題がある

Question

ページを関連セクションにスクロールするときに、navアイテムのクラスを変更するスクリプトを作成して変更した人がいます。元の投稿はUse jQuery to change a class dependent on scroll positionです。

私の最初の問題は、配列の最後のセクションが無視されていることです。他の誰かがこの質問をしてくれました。解決策が提供されましたが、それは私のためではありませんでした。jQuery class change based on scroll ignoring last section。

2番目の問題は、配列の最後のセクションが選択されていないことを除いても、新しいクラス名はナビゲーション項目に追加されるだけですが削除されないので、ページの一番下にあり、ナビゲーション内の最後のアイテムはクラスとして「選択」されています。私は本当にどんな洞察にも感謝します。ここでは修正されたバージョンとほとんど同じである私のコードは、ですが、私はむしろセクションより見出しを使用してい除き、（多分重要である？）：

var $anchs = $('.content h1'); 
    var $navs = $('#zone-submenu div .content > .item-list > ul > li'); 

    topsArray = $anchs.map(function(){ 
     return $(this).position().top - 100; 
    }).get(), 
    topsArray.push(window.height); 

    var len = topsArray.length; 
    var currentIndex = 0; 

    var getCurrent = function(top) { // take the current top position, and see which 
     for(var i = 0; i < len; i++) { // index should be displayed 
      if(top > topsArray[i] && topsArray[i+1] && top < topsArray[i+1]) { 
       return i; 
      } 
     } 
    }; 
    $(document).scroll(function(e) { 
     var scrollTop = $(this).scrollTop(); 
     var checkIndex = getCurrent(scrollTop); 
     if(checkIndex !== currentIndex) { 
      currentIndex = checkIndex; 
      $navs.eq(currentIndex).addClass("selected").siblings(".selected").removeClass(".selected"); 
     } 
    }); 

私はサイト自体を投稿することができない怖いです - それは開発中であり、ライブになる前にそれを明らかにすることはできません。しかし、どんな助けもありがとう！

Answer 1

これは少し奇妙に見える：

currentIndex = checkIndex; 
$navs.eq(currentIndex).addClass("selected").siblings(".selected").removeClass(".selected"); 

私はあなたのコードに伝えることができるものから、それは次のようになります。

「最後のインデックス項目を表示しないを修正 を更新し

$navs.eq(currentIndex).removeClass('selected'); // no dot 
currentIndex = checkIndex; 
$navs.eq(currentIndex).addClass("selected"); 

"...

getCurrent関数で無効な配列要素を参照しています - [i + 1]はinvalですidはi == len-1のときです。その場合、最後の要素を返す必要があります。

var getCurrent = function(top) { // take the current top position, and see which 
    for(var i = 0; i < len-1; i++) { // index should be displayed 
     if(top > topsArray[i] && topsArray[i+1] && top < topsArray[i+1]) { 
      return i; 
     } 
    } 
    return len-1; 
};