jQuery .parent().parent()问题

Question

因此，我对jQuery并不熟悉，我试图更改div的内容，这是函数触发器的两个级别：

这里是我的第一次尝试:我试图找到最近的'.node‘，它是所有其他div的父函数，并编辑子div。

<script>
function details() {
    $node = $(this).closest( ".node" );
    $node.find( ".content.right .user" ).show();
    $node.find( ".options" ).show();
    $node.find( ".details" ).hide();
}
</script>

由于没有运行，所以我尝试了这样的方法：

<script>
function details() {
    $node = $(this).parent( ".details" ).parent( ".node" );
    $node.find( ".content.right .user" ).show();
    $node.find( ".options" ).show();
    $node.find( ".details" ).hide();
}
</script>

但这也没用，所以我现在迷路了。以下是我的HTML：

<div class="node">
    <div class="avatar left" style="background-image:url(assets/default_avatar.png);"></div>
    <div class="content right">
        <div class="user">Foo <a href="./">~Foo_bat</a></div>
    Integer quis ante iaculis, mollis nibh fermentum, vestibulum massa. Quisque et erat et dolor sagittis posuere eu ac risus. Vestibulum a varius turpis. Nunc tincidunt ipsum at tellus volutpat vestibulum. Nulla elementum neque a lectus ullamcorper, eu amet.</div>
    <div class="options">
        <a class="left" href="./reply">Reply</a>
        <a class="left" href="./repost">Repost</a>
        <a class="right" href="./report">Report</a>
    </div>
    <div class="details">
        <a class="right" href="#" onclick="details()">Details</a>
    </div>
</div>

有人知道为什么这不管用吗？可能是很容易看到的，但我找不出来.

Answer 1

您应该将objject传递给该函数。因为在当前方法中，this引用窗口对象。

<a class="right" href="#" onclick="details(this)">Details</a>

然后可以使用.closest()而不是parent().parent()。

function details(obj) {
    $node = $(obj).closest( ".node" );
    $node.find( ".content.right .user" ).show();
    $node.find( ".options" ).show();
    $node.find( ".details" ).hide();
}

Answer 2

如果您正在使用jQuery，我建议您使用jQuery click处理程序，而不是内联单击。

function details(el) {

    $node = $(el).closest( ".node" );
    $node.find( ".content.right .user" ).show();
    $node.find( ".options" ).show();
    $node.find( ".details" ).hide();
}

$('.details a.right').click(function(e){
    e.preventDefault();
    details(this)
});

小提琴

Answer 3

您应该尝试其他的jQuery选择器来选择上面的标签，“父母”，您这个选择器有很多帮助您的参数。要获取".node“标记，可以使用：{$(this).parents('.node')} }