javascript - 在 PHP 循环中显示/隐藏

Question

我遇到了一个问题，我需要为我的用户显示订单历史记录，功能如下。

订单历史记录 - 每个订单摘要 - (单击详细信息) - 详细信息可见。我面临的问题是，当将类放在 JavaScript 上时，我会看到所有详细信息选项卡一键显示，因为我需要它成为用户单击详细信息时唯一可见的选项卡，并且这应该是针对该订单本身而不是针对他的其余命令。

下面是我的 PHP 代码

<div class="detail-btn" id="detail_button">
  <a href="javascript:void(0)">DETAILS</a>
</div>

<div class="detailShow" id="detailbtnshow"></div>

<div class="detail-btn" id="detail_button">
  <a href="javascript:void(0)">DETAILS</a>
</div>

<div class="detailShow" id="detailbtnshow"></div>

<div class="detail-btn" id="detail_button">
  <a href="javascript:void(0)">DETAILS</a>
</div>

<div class="detailShow" id="detailbtnshow"></div>

<div class="detail-btn" id="detail_button">
  <a href="javascript:void(0)">DETAILS</a>
</div>

<div class="detailShow" id="detailbtnshow"></div>

我使用过的JavaScript如下。

 $("#detail_button").click(function(){
    $("#detailbtnshow").slideToggle();
 });

我尝试过使用类，唯一的问题是我的所有详细信息 div 一键打开，但我希望它们在用户单击相关详细信息按钮时打开

Answer 1

试试这个，您只需要显示单击的 div 的下一个 div:

$(".detail-btn").click(function(){
    $(this).next(".detailShow").slideToggle();
});