Question

我正在使用wordpress并且在我的循环中我有一个可点击的链接来切换div以显示和隐藏内容，因为这是在循环内它为循环中的每个项目使用相同的类，所以当我切换一个链接，显示所有内容。

<div class="additional-info">Additinal Information</div>

<div class="additional-info-box">
   <?php echo $additional_info; ?>
</div>


<script type="text/javascript">
$(document).ready(
    function(){
        $(".additional-info").click(function () {
            $(".additional-info-box").toggle();
        });
    })
</script>

因此，为每个帖子生成了附加信息类和附加信息框，但是当我点击任何附加信息div时，每个附加信息框都会显示出来。

Answer 1

尝试包装：

<div class="additional-info">
     Additinal Information
    <div class="additional-info-box">
      <?php echo $additional_info; ?>
    </div>
</div>

<script type="text/javascript">
$(document).ready(
    function(){
        $(".additional-info").click(function () {
            $(this).find(".additional-info-box").toggle();
        });
    })
</script>

只有点击.additional-info才会显示其内容。

Live Demo

单击Jquery显示div一次只适用于1 div

1 个答案: