Question

我正在尝试为wordpress构建设置一个简单的注释切换。

CSS

<div class="commenttoggle">
    <p class="popcom">Show Comments</p>
                                     ~~~Clickable Button~~~~~~
</div>
<div id="comments" class="comments-area">
                                     ~~~~PHP code calling WP comments~~~
</div>

的jQuery

    jQuery(document).ready(function($) {
       $('.comments-area').hide();

           $('.commenttoggle').click(function() {
             $('.comments-area').toggle();
           });
       });

上面的代码有效但当我点击一个帖子下的显示评论按钮时，所有评论部分都会显示。我一直在关注jQuery api＆amp;在stackoverflow，但似乎无法找到任何关于只切换最接近click事件的元素的建议。

我试过.closest＆amp; .parent但我似乎无法使它工作。我真的很感激一些代码，但也有一个解释，因为我刚刚开始使用jQuery。

Answer 1

您需要使用each对具有相同类popcom的元素进行迭代，并应用$(this)来定位所单击的元素

$('.popcom').each(function() {
    $(this).click(function() {
        // Your script here              
    });
})

注意：.popcom是您的节目评论按钮的类

Answer 2

这应该做你想要的：

jQuery(document).ready(function($) {
    $('.comments-area').hide();
    $('.commenttoggle p').click(function() {
        $(this).closest("div").next('.comments-area').toggle();
    });
});

单击其他div时，切换类中的单个元素Jquery

2 个答案: