Question

我在wordpress中有一系列帖子，每个帖子都有隐藏部分，点击链接即可显示。无法定位该特定帖子的子节点，作为普通的div引用会立即显示所有隐藏的部分..

<div class="individual">
    <div class="m-all t-1of4 d-1of4">
        <a class="headshot" href="" style="color: #000 !important">
            <h3>Test</h3>    
        </a>
    </div>
    <div class="desciption-show" style="display: none; background: #ffffff;">
        <div class="m-all t-all d-all cf">
            <h3>Testasdf</h3>
            <h4>Testasdfasdfasdf</h4>
            <p>Testdghjfghjfghj</p>
            <p><em>fghjrtysdfgdfgh</em></p>
            <a class="close" href="">Close</a>
        </div>
    </div>
</div>

$(document).ready(function(){
    $("a.headshot").click(function() {
        $(this).parents(".individual").children('.description-show').show('fast');
    });
});

Answer 1

你可以使用closest()函数来定位父元素，然后在父元素中找到子元素，试试这段代码

$(document).ready(function(){
    $("a.headshot").click(function(event) {
        event.preventDefault();
        $(this).closest(".individual").children('.desciption-show').show('fast');
    });
});

Answer 2

这是错误的

<div class="desciption-show" style="display: none; background: #ffffff;">

因为写错了，

$('.description-show')

将div类从 desciption-show 更改为 description-show 。

加上，我会以这种方式找到我的元素

$(".headshot").click(function (e) {
    e.preventDefault();
        $(this).closest(".individual").find('.description-show').show();
});

这是a fiddle。

希望这有帮助

瞄准父母的孩子 - jQuery

2 个答案: