자동 선택 현재 종류 - 탐색 메뉴

그래서 내가 페이지를 현재 최종 사용자를 의미하는 "선택한"클래스로 업데이트 탐색을 가지고있다 달성하기 위해 시도하고 켜져 있습니다.

나는 많은 것을 시도했다. 그러나 아무것도 작동하지 않는 것 같습니다.

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; 
}

나는 여기에 내 코드입니다 f 당신은 내가 바라는 것을 혼란 스럽습니다.이 링크를 볼 수 있습니다 : http://docs.jquery.com/Tutorials:Auto-Selecting_Navigation

고마워요!

출처

2012-03-14 Aaron Brewer

편집 : 나는 당신의 웹 사이트에보고 및 경로의 값은 아마 당신이 substringlastIndexOf/을 기반으로한다 portfolio/newish/index.html

입니다. 그대로

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'); 
});

귀하의 코드가 잘 보이는, 아래 시도,하지만 난 당신이 요소에 클래스를 추가 할 .addClass를 사용한다고 생각합니다. 아래에서 시도하십시오.

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

출처

2012-03-14 19:15:52

문제가 해결되는지 잘 모르겠지만 셀렉터를''navigation a [href $ = " '+ path +'"] '' –

@MikeTangolics : Welp, 내 문제가 해결되었지만 확실히 코드를 단축했다. 고맙습니다! –

@SKS : 고맙습니다. 고쳐 주진 않았습니다. –

location.pathname.substring(1)이 예상 한 결과를 출력하고 있는지 확인 했습니까? 즉, index.html 등입니까?

path function works (JS는 iframe 때문에 show을 추가 함) 선택기가 올바르게 표시되므로 내가 예상 할 수있는 유일한 경로는 출력 할 경로가 내 사이트에 출력되지 않는다는 것입니다.

출처

2012-03-14 19:36:13 ScottS

자동 선택 현재 종류 - 탐색 메뉴

답변

관련 문제