JQueryで特定のURLアンカーにクラスを追加する

Question

セクション間でスクロールするメニューの色を変更する必要があります。 URLに特定のアンカーが含まれている場合、メニューの色が変わる必要があります。 私は以下を試しましたが、このケースでは、特定のアンカー上にある場合にのみメニューが変化し、別のアンカーに再びスクロールするとメニューは変わりません。

$(document).ready(function() { 
    if (window.location.href.indexOf("#7") > -1) { 
    $('.menu_item a').css('color', '#000'); 
    } else { 
    $('.menu_item a').css('color', '#fff'); 
    } 
}); 

Answer 1

あなたはなhashchangeは、ページをリロードしないとハッシュは、だけではなくpageloadに、同様に変更する火災イベントハンドラが必要になります。

$(document).ready(function() { 
    $(window).on('hashchange', function() { 
     if (window.location.href.indexOf("#7") > -1) { 
      $('.menu_item a').css('color','#000'); 
     } else { 
      $('.menu_item a').css('color','#fff'); 
     } 
    });  
}); 

はまた、スクロールイベントを使用することができますが、そこhashchangesための特定のイベントがあり、ハッシュは異なる結果を得るために変更することがあるとして、あなたはおそらくhashchangeイベントとの方が良いと思います。