jQuery - 이전 요소 링크를 선택하십시오.

Question

왜 이것이 작동하지 않는지 알 수 없습니다. 목록이 있는데, 각 항목에는 앵커의 배경 이미지가 있습니다. jQuery를 사용하여 선택한 앵커 바로 앞에있는 항목의 배경 이미지를 제거하려고합니다. 다음은 HTML입니다 :

<ul id="menu"> 
<li class="last"><a href="#">Contact Us</a></li> 
<li><a href="#">Testimonials</a></li> 
<li><a href="#">Projects</a></li> 
<li class="selected"><a href="#">Our Services</a></li> 
<li><a href="#">About Us</a></li> 
<li><a href="#">Home</a></li> 
</ul> 

그리고 여기에 내가 시도하고 (디스플레이 사용하지 : 테스트 용 없음) : 배경 이미지를 제거하기 위해 사용하고있는 jQuery를하다 내가 다음을 사용하는 경우

$('li.selected a').prev().css({display : "none"}); 

을, 작동합니다 :

그러나 앵커 태그가 포함되는 즉시 중지됩니다.

TLDR : 기본적으로 선택한 링크 앞에있는 "projects"를 선택하고 링크 된 배경 이미지 (목록 항목이 아닌 링크)를 제거해야합니다. 아무도 그 코드가 작동하지 않는 이유를 말해 줄 수 있습니까?

감사

Answer 1

<a> 링크는 더 이전 요소가 없습니다. 그것은 목록 요소의 자식으로 단독입니다. DOM의 한 레벨 위로 <li>까지 올라간 다음 .prev을 사용해야합니다.

처럼

jsFiddle example

또는 사용자의 특정 요구에 대한 $('li.selected a').parent().prev().css({display : "none"});​ :

$('li.selected a').parent().prev().children('a').css({backgroundImage : "none"});​​​​​​​​​​​​​​​ 

Answer 2

.prev(0) 및 .next()은 이전 및 다음 형제 각각 선택한 요소의에서 선택합니다. 당신의 목적이 작동합니다 : $('li.selected a')에서

$('li.selected').prev().find("a").css({display : "none"});