jQuery 선택기에서 $ (this)를 어떻게 제외시킬 수 있습니까?


203

나는 이와 같은 것을 가지고있다 :

<div class="content">
    <a href="#">A</a>
</div>
<div class="content">
    <a href="#">B</a>
</div>
<div class="content">
    <a href="#">C</a>
</div>

이 링크 중 하나를 클릭하면 클릭하지 않은 링크에서 .hide () 함수를 수행하고 싶습니다. 내가 jQuery를이 가지고 이해 :없는 선택,하지만 때문에이 경우에 사용하는 방법을 알아낼 수 없습니다 내가 사용 링크를 선택하는 것이 필요하다$(".content a")

나는 같은 것을하고 싶다

$(".content a").click(function()
{
    $(".content a:not(this)").hide("slow");
});

그러나이 경우 : not 선택기를 올바르게 사용하는 방법을 알 수 없습니다.


3
!$(this)더 간단한 코드를 사용해보십시오 .
Ari

답변:


390

선택기 대신 not() 방법을 사용해보십시오 .:not()

$(".content a").click(function() {
    $(".content a").not(this).hide("slow");
});

이 기능이 작동하지 않는 이유는 ... $ ( "# menu-holder #first_level li"). not (this) .addClass ( "returnToParent");
marck

4
@marck 문맥이 없으면 모르겠습니다. 새로운 질문을 작성하면 도와 드릴 수 있습니다.
Dan Herbert

2
이것은 성능이 매우 나쁜 솔루션입니다. 콜백 $(".content a")내부에 실질적인 이유는 없습니다 click... 클릭 할 때마다 ...
Ronen Cypis


9

jQuery .siblings()메소드를 사용할 수도 있습니다 .

HTML

<div class="content">
  <a href="#">A</a>
  <a href="#">B</a>
  <a href="#">C</a>
</div>

자바 스크립트

$(".content").on('click', 'a', function(e) {
  e.preventDefault();
  $(this).siblings().hide('slow');
});

실무 데모 : http://jsfiddle.net/wTm5f/


5

"siblings ()"메소드를 사용해야하며 해당 효과를 적용하기 위해 ".content a"선택기를 반복해서 실행하지 않아야합니다.

HTML

<div class="content">
    <a href="#">A</a>
</div>
<div class="content">
    <a href="#">B</a>
</div>
<div class="content">
    <a href="#">C</a>
</div>

CSS

.content {
    background-color:red;
    margin:10px;
}
.content.other {
    background-color:yellow;
}

자바 스크립트

$(".content a").click(function() {
  var current = $(this).parent();
  current.removeClass('other')
    .siblings()
    .addClass('other');
});

여기를 참조하십시오 : http://jsfiddle.net/3bzLV/1/

당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.