sourcecode

jQuery 셀렉터에서 $(이것)를 제외하려면 어떻게 해야 합니까?

copyscript 2023. 8. 22. 22:25
반응형

jQuery 셀렉터에서 $(이것)를 제외하려면 어떻게 해야 합니까?

나는 다음과 같은 것이 있습니다.

<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가 :not selector를 가지고 있다는 것을 이해하지만, 나는 이 경우에 어떻게 그것을 사용하는지 알 수 없습니다. 왜냐하면 나는 다음을 사용하여 링크를 선택해야 하기 때문입니다.

저는 다음과 같은 것을 하고 싶습니다.

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

하지만 이 경우에는 선택기를 제대로 사용하지 못하는 방법을(not selector)

선택기 대신 메소드를 사용해 보십시오.

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

선택기 대신 다음 기능을 사용할 수 있습니다.

$(".content a").not(this).hide("slow")

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/

"silings()" 방법을 사용해야 하며, 이러한 효과를 적용하기 위해 ".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/

언급URL : https://stackoverflow.com/questions/437958/how-can-i-exclude-this-from-a-jquery-selector

반응형