jQuery .parent().parent() 问题

Question

所以，我是 jQuery 的新手，我正在尝试更改关于函数触发器的 2 个级别的 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

如果您无论如何都在使用 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)
});

Fiddle