Question

我有以下结构：

<li>
    <div class="button_holder">
        <div class="buttons">
            <div class="tag"></div>
        </div>
    </div>
    <div class="holder">
        <div class="cover" style="display:none"></div>
    </div>
</li>

我想点击.tag并显示.cover

我正在尝试：

$(document).on('click', '.tag', function() {

    $(this).closest('.button_holder').next('.holder').find('.cover').show();

});

但不是从display:none

更改它

是正确的方法来遍历一棵树然后再回到下一个兄弟姐妹并进入其中一个孩子吗？

Answer 1

<强> DEMO
的 HTML

<li><div class="button_holder"> <div class="buttons"> <div class="tag">dffd</div> </div> </div> <div class="holder"> <div class="cover" style="display:none">ddddd</div> </div> </li>

JS

$(document).on('click', '.tag', function() { $(this).closest('li').find('.cover').show(); });

Answer 2

Demo 你正在做正确的方法，但是你错过了一些内容。

<div class="button_holder">
        <div class="buttons">
            <div class="tag">dffd</div>
        </div>
    </div>
    <div class="holder">
        <div class="cover" style="display:none">ddddd</div>
    </div>

通过上下遍历树来查找和显示

2 个答案: