我將如何選擇所有具有相同名稱的div類，但使用jQuery / javascript的當前div除外？

Question

我有以下代碼：

<div class="pvh_wrap">

<div class="pvh_item">
<div class="pvh_overlay"></div>
<div class="pvh_title">Lorem ipsum dolor sit amet</div><!-- end .pvh_title -->
<div class="pvh_button"><strong>Vote</strong></div><!-- end .pvh_button -->
</div><!-- end .pvh_item -->

<div class="pvh_item">
<div class="pvh_overlay"></div>
<div class="pvh_title">Lorem ipsum dolor sit amet</div><!-- end .pvh_title -->
<div class="pvh_button"><strong>Vote</strong></div><!-- end .pvh_button -->
</div><!-- end .pvh_item -->

<div class="pvh_item">
<div class="pvh_overlay"></div>
<div class="pvh_title">Lorem ipsum dolor sit amet</div><!-- end .pvh_title -->
<div class="pvh_button"><strong>Vote</strong></div><!-- end .pvh_button -->
</div><!-- end .pvh_item -->

<div class="pvh_item">
<div class="pvh_overlay"></div>
<div class="pvh_title">Lorem ipsum dolor sit amet</div><!-- end .pvh_title -->
<div class="pvh_button"><strong>Vote</strong></div><!-- end .pvh_button -->
</div><!-- end .pvh_item -->

<div class="pvh_item">
<div class="pvh_overlay"></div>
<div class="pvh_title">Lorem ipsum dolor sit amet</div><!-- end .pvh_title -->
<div class="pvh_button"><strong>Vote</strong></div><!-- end .pvh_button -->
</div><!-- end .pvh_item -->

</div><!-- end .pvh_wrap -->

我想做的是單擊pvh_button時，顯示了pvh_overlay div，但當前div中的一個除外。 當前的div將是單擊了pvh_button的pvh_item類。到目前為止，我已經通過將它們設置為display：inline來打開所有pvh_overlay，但是我希望除當前的之外的所有東西都可以打開。 我該怎么做？

<script>
$('.pvh_button').click(function(event) {
    $('.pvh_overlay').css('display', 'inline');     
});
</script>

謝謝。

Answer 1

$('.pvh_button').click(function(event) {
    var $currentContainerOverlay = $(this).parent().children('.pvh_overlay');
    $('.pvh_overlay').not($currentContainerOverlay).css('display', 'inline');     
});

Answer 2

siblings（）方法所需的解析可能更少。 如果要解析巨大的HTML結構，可能會更快。

$('.pvh_button').click(function(event) {
    $('.pvh_overlay').not($(this).siblings('.pvh_overlay')).css( {'display':'inline' });    
});