自動選択する現在のクラス - ナビゲーションメニュー

Question

さて、

だから私が達成しようとしていると、ナビゲーションは、現在のエンドユーザーがオンになっているページを意味する「選択」クラスで更新持っています。

私は多くのことを試しました。しかし、何も動作していないようです。ここに私のコードは次のとおりです。

のjQuery：

jQuery(function() { 
    var path = location.pathname.substring(1); 
    if (path) 
     jQuery('.navigation ul li a[href$="' + path + '"]').attr('class', 'selected'); 
}); 

HTML：

<div class="navigation"> 
    <ul> 
     <li><a href="index.html">HOME</a></li> 
     <li><a href="team.html">TEAM</a></li> 
     <li><a href="about.html">ABOUT</a></li> 
     <li><a href="services.html">SERVICES</a></li> 
     <li><a href="portfolio.html">PORTFOLIO</a></li> 
     <li><a href="contact.html">CONTACT</a></li> 
    </ul> 
    <div class="clear"></div> 
</div> 

CSS：

.navigation li a.selected { 
    background: url(../images/navigation-background-active.png) repeat-x; 
    text-decoration: none; 
} 

私はあなたは私が求めていることを混乱しています...あなたはこのリンクを見ることができます： http://docs.jquery.com/Tutorials:Auto-Selecting_Navigation

ありがとうございました！

Answer 1

編集：私はあなたのウェブサイトを見て、パスの値は、おそらくあなたがsubstringlastIndexOf/に基づくべきでportfolio/newish/index.html

です。あるとしてあなたのコードは正常に見えるが、私はあなたが要素にクラスを追加する.addClassを使うべきだと思う

jQuery(function() { 
    var path = location.pathname; //return /portfolio/newish/index.html 
    path = path.substring(path.lastIndexOf('/') + 1); //will return index.html 

    if (path) 
     jQuery('.navigation ul li a[href$="' + path + '"]').addClass('selected'); 
}); 

、以下試してみてください。お試しください

jQuery('.navigation ul li a[href$="' + path + '"]').addClass('selected'); 

Answer 2

location.pathname.substring(1)が期待どおりの結果を出力していることを確認しましたか？つまり、index.htmlなどですか？

path function works（iframeが原因でshowが追加されます）、セレクタが正しいように見えるので、出力すると予想されるパスがサイトに出力されていないことが考えられます。