javascript – JQuery在.each循环中切换所有div

我把我的帖子放在.each循环上,我有一个链接在循环的底部显示注释.

我想在点击时显示评论部分,但是当我点击所有帖子的评论时也会打开.我只想要点击一个打开的那个.

我已经尝试了很多我在这个网站上找到的不同的例子,但到目前为止还没有一个有效.

我确信这很容易实现,但我是一个JavaScript菜鸟.

这是JSFiddle链接 – http://jsfiddle.net/omgwhyamisobad/h0yhvqa3/

以及代码片段 –

JS

$(document).ready(function() {
  $('.artist-micropost-comment-click').click(function() {
    $('.artist-micropost-comments-container').toggle();
  });
});

HTML

<div class="artist-micropost-social">
  <a class="artist-micropost-comment-click">comments</a>
</div>
<div class="artist-micropost-comments-container">
...
...
...
</div>

<div class="artist-micropost-social">
  <a class="artist-micropost-comment-click">comments</a>
</div>
<div class="artist-micropost-comments-container">
...
...
...
</div>

<div class="artist-micropost-social">
  <a class="artist-micropost-comment-click">comments</a>
</div>
<div class="artist-micropost-comments-container">
...
...
...
</div>

CSS

.artist-micropost-comments-container {
  display: none;
}
你试图抓住相关元素的方式是错误的.您需要根据被单击的元素遍历DOM.如果在这种情况下尝试使用直接类选择器,那么它将选择具有所提供类的所有元素.

尝试,

$(document).ready(function() {
  $('.artist-micropost-comment-click').click(function() {
    $(this).closest('.artist-micropost-social')
             .next('.artist-micropost-comments-container').toggle();
  });
});

DEMO

相关文章
相关标签/搜索