在 jQuery 中切换重复的类

Question

我有这样的 HTML 代码：

<div id="content">
  <div class="profile_photo">
   <img style="float:left;margin-right:7px;" src="http://gravatar.com/avatar/53566ac91a169b353a78b329bdd35c95?s=50&d=identicon" class="profile_img" alt="{username}"/>
  </div>
  <div class="container" id="status-#">
   <div class="message">
    <span class="username">{username} Debugr Rocks!
   </div>
   <div class="info">24-oct-2010, 14:05 GMT · <a href="#" class="toggle_comment" title="Comment">Comment (5)</a> · <a href="#" title="Flag" class="toggle_flag">Flag</a> · Via <a href="#" title="Twitter">Twitter</a>
</div>
   <div class="comment_container">
    <div class="profile_photo">
     <img style="float:left;margin-right:7px;" src="http://gravatar.com/avatar/53566ac91a169b353a78b329bdd35c95?s=32&d=identicon" class="profile_img" alt="{username}"/>
    </div>
    <div class="comment_message">
     <span class="username"><a href="#" title="{username}">{username}</a></span> Debugr Rocks! XD
    </div>
    <div class="comment_info">24-oct-2010</div>
   </div>
  </div>
  <div class="profile_photo">
   <img style="float:left;margin-right:7px;" src="http://gravatar.com/avatar/53566ac91a169b353a78b329bdd35c95?s=50&d=identicon" class="profile_img" alt="{username}"/>
  </div>

重复两次或多次。我想要做的是，当我单击“评论 (5)”链接时，会出现“comment_container”类，但只有同一“容器”类中的类。

这可能吗？

Answer 1

您可以使用 .closest() 转到 .container 然后 .find() 查看其内部，就像这样：

$(".toggle_comment").click(function() { 
    $(this).closest(".container").find(".comment_container").show();
});

你可以在这里尝试，如果你想找到其他相关的东西到 this 这里是树遍历函数的完整列表。

---

顺便说一句，您的 HTML 中有一个错误需要更正，

<span class="username">{username} Debugr Rocks! </div>

应该是：

<span class="username">{username} Debugr Rocks! </span>