JQuery와 내가 여기에 몇 가지 jQuery를이 문제

Question

'포함' url을 메뉴에서 href로 누른 다음 굵게 표시하십시오. 이 메뉴 항목을 클릭하면

JQuery와의 두번째 부분은 하나의 왼쪽 메뉴에서 단어를 확인 www.website.co.uk/aboutus/abgroup.apx

는 URL로의 벌금을 보여줍니다 페이지를 선택한 다음 해당 문자열과 일치하는 스타일을 상단 메뉴에 추가합니다. 그러나 모든 최상위 메뉴 항목을 대담하게 만드는 것으로 보입니다.

아이디어가 없습니다.

URL에 .co.uk가 포함되어있는 경우 페이지로드시에 다음과 같이 필요합니다. li a을 굵게 표시합니다.

MENU 마크 업 :

<ul class="sf-menu"> 
    <li class="first"><a href="http://www.site.co.uk/en-us/home.aspx">Home</a></li> 
    <li class=""><a href="http://www.site.co.uk/en-us/aboutus/abgroup.aspx">About Us</a></li> 
    <li class=""><a href="http://www.site.co.uk/en-us/casestudies.aspx">Case Studies</a></li> 
</ul> 

이것은 두 부분 질문입니다,

1) 내가 URL이 바로 www.website.co 때 모든 굵게 만드는 jQuery를 중지해야 .uk는 href와 url과의 비교에서 실패했습니다.

2) 내가 충분히 특정하지이기 때문에 모든 시간 (이있을 수 있습니다 강조되는 포함 일부 페이지에, 내가 확인하지만, 상단 메뉴의 밤은하는 ID를 사용하고 이유를 알고 필요.)

이 내 "회사 소개"메뉴이다. (나는 또한이 서비스 부문과 같은 원리가 적용 - 내가 메뉴에서 DIV를 검색하고 대담한 상단 해당 메뉴 항목을 만들고 싶어

<ul id="menu2"> 
    <div>About Us<br> 
    </div> 
    <li><a href="/en-us/aboutus/ABgroup.aspx" class="current">A&amp;B Group</a></li> 
    <li style="padding-left: 10px;"><a href="/en-us/aboutus/csr.aspx">CSR</a></li> 
    <li style="padding-left: 10px;"><a href="/en-us/aboutus/csr/sustainability.aspx">Sustainability</a></li> 
    <li style="padding-left: 10px;"><a href="/en-us/aboutus/csr/healthsafety.aspx">Health &amp; Safety</a></li> 
    <li><a href="/aboutus/ab/aluminiumsheets.aspx">Aluminium Sheets</a></li> 
    <li><a href="/aboutus/ab/test.aspx">Test</a></li> 
    <li><a href="/aboutus/ab/cars.aspx">Cars</a></li> 
    <li><a href="/aboutus/ab/houseinteriors.aspx">House Interiors </a></li> 
    <li><a href="/aboutus/ab/abreports.aspx">A&amp;B reports</a></li> 
</ul> 

Answer 1

가 유효하지 않습니다 <ul>의 루트 요소로 <div>를 갖는만큼

var pattern = new RegExp('http(s?):\/\/(?:[\w-]+\.)?testsite\.co\.uk(/?)$'); 
if(pattern.test(window.location.href)) { 
    $('.first').css('font-weight', 'bold'); 
} else { 
    $('a[href*="' + window.location.href + '"]').css('font-weight', 'bold'); 
} 

간단하다. 이것이 제목 인 경우 머리글 태그를 사용하고 <ul> 앞에 넣는 것이 좋습니다. 이런 식으로 뭔가 :

<h2>About Us</h2> 
<ul> .... </ul> 

다음 당신은 자바 스크립트를과 같이가 someting 간단한 작업을 수행 할 수 있습니다

var title = $('h2').text(); 
if(title !== '') $("ul.sf-menu li a:contains('" + title + "')").css('font-weight', 'bold'); 

Answer 2

이 플러그인 사용 JAMES PADOLSEY regex selector for JQuery

그리고 사용과 같은 : 첫 번째 부분을 해결

var regexp_part = /\w+\.aspx$/.exec(window.location.href)[0]; 
if (regexp_part != null) { 
    $('a:regex(href, ' + regexp_part[0] +'$)').css('font-weight', 'bold'); 
}