jQuery:选择除下一个之外的所有元素

Question

我有以下标记:

<!-- first marker -->
<div class="marker"></div>
<div class="tooltip">
    <p>My tooltip content"</p>
</div>

<!-- second marker -->
<div class="marker"></div>
<div class="tooltip">
    <p>My tooltip content"</p>
</div> 

<!-- repeating..... -->

以及以下 jQuery javascript:

$(document).ready(function() {

    $(".marker").hover(function(event){
        $('.tooltip').hide();
        $(this).next('.tooltip').slideDown('fast');
    });

});

如何修改此脚本，以便在悬停时隐藏除下一个之外的所有其他打开的 div.tooltips？目前它试图隐藏所有内容。

Answer 1

您可以使用not函数省略特定元素

$(".marker").hover(function(event){
    var nextEl = $(this).next("div.tooltips");
    $('.tooltip').not(nextEl).hide();
    $(this).next('.tooltip').slideDown('fast');
});

编辑

此外，您可能还需要向 hover 传递第二个函数，以便在悬停结束时清理内容:

$(".marker").hover(function(event){
    var nextEl = $(this).next("div.tooltips");
    $('.tooltip').not(nextEl).hide();
    $(this).next('.tooltip').slideDown('fast');
}, function() {
    $('.tooltip').hide();
});