はあなたがいずれかのことができます...アクティブなメニュー項目

Question

に

<ul> 
<li class="home"><a href="/">Home</a></li> 
<li class="gallery"><a href="/gallery">Gallery</a></li> 
<li class="products"><a href="/products">Products</a></li> 
</ul> 

Answer 1

をクラスを追加します。サーバー側は「現在」のページであるかを検出し、右liに「アクティブ」クラスをレンダリング、OR、現在のページであるかを検出するためにはJavaScriptを使用して、クラスに

jQueryのコードを追加します：

$('.gallery').addClass('active'); // for the 'gallery' page 

Answer 2

メニューをアクティブにするには、以下のようにすることができます。

<ul id="ulMenu"> 
    <li class="home"><a href="/">Home</a></li> 
    <li class="gallery"><a href="/gallery">Gallery</a></li> 
    <li class="products"><a href="/products">Products</a></li> 
</ul> 

は、マスターページ内の関数の下に試してみて、URLは機能の値が含まれている変更（あなたは以下より特定のページのあなたのURLの内容を決定した場合のサンプルコードでは、あなたに役立つかもしれません）。

function MakeActiveMenu() 
{ 
    var currentURL = window.location.pathname; 
    var allMenu = $("#ulMenu").find('li'); 

    if(allMenu != null){ 
     $.each(allMenu, function(index,value){ 
      value.classList.remove('active'); 
     }); 
    } 

    if(currentURL != null){ 

     if(currentURL.toLowerCase().contains("Home")) { 
     $('.home').addClass('active'); 
     } 
     else if (currentURL.toLowerCase().contains("Gallery")){ 
     $('.gallery').addClass('active'); 
     } 
     else if (currentURL.toLowerCase().toLowerCase().contains("Products")){ 
     $('.products').addClass('active'); 
     } 
    } 
}