Question

我有一个包含数据库信息的表格。有 ID、姓名、主题和日期。当我单击表格的一行 (tr) 时，我想显示更多数据，如消息、操作系统、IP 等。我找到了解决方案，但它只在第一个 tr 上起作用，而不是全部。

这是我的代码：

while($row = $result->fetch_assoc())
{
   $id=$row['ID'];
   $name=$row['Name'];
   $mail=$row['Email'];
   $subject=$row['Subject'];
   $message=$row['Message'];  
   $date=$row['Date'];
   $ip=$row['IP'];
   $device=$row['Device'];
   $os=$row['OS'];
   $browser=$row['Browser'];
   $finish=$row['Finish'];

   echo 
       '<tr class="trX" id="flip">
           <td class="tdX">' . $id . '</td>
           <td class="tdX">' . $name . '</td>
           <td class="tdX">' . $subject . '</td>
           <td class="tdX">' . $date . '</td>
           <div id="panel">
           ID:' . $id . '
           Name:' . $name . '
           Email:' . $mail . '
           Subject:' . $subject . '
           Message:' . $message . '
           Date:' . $date . '
           IP:' . $ip . '
           Mobile:' . $device . '
           OS:' . $os . '
           Browser:' . $browser . '
           Finish:' . $finish . '
         </div>
       </tr>';
    
 
}
echo ' </table>  ';

和 JS 查询

  $(document).ready(function(){
  $("#flip").click(function(){
    $("#panel").slideToggle("slow");
  });
});

感谢提示

Answer 1

它仅适用于第一个 tr，因为您不能将 ID flip 重用于其他元素。我能想到的几个解决方案：

有一个递增的变量并将其分配给 id，如 flip-i，我这里是递增变量。将点击事件附加到此，然后切换子元素。
将点击事件附加到一个类，然后切换该点击类的子级。

如何显示表格的更多信息

1 个答案: