基于状态筛选：动态隐藏HTML表格行的教程-php教程-PHP中文网

基于状态筛选：动态隐藏HTML表格行的教程

DDD

发布： 2025-08-30 20:42:01

原创

479人浏览过

基于状态筛选：动态隐藏html表格行的教程

本教程旨在指导开发者如何根据数据库中获取的状态信息，动态地隐藏HTML表格的行。通过创建带有状态值的按钮，并利用PHP的GET方法，实现点击按钮后只显示特定状态的表格行的功能。同时，教程会强调SQL注入的潜在风险，并提供避免此风险的建议。

实现基于状态的表格行筛选

本节将介绍如何创建一个可以根据状态值筛选表格行的HTML页面。核心思路是利用PHP的GET方法传递状态值，然后在SQL查询中根据这个值来筛选数据。

1. 创建状态筛选按钮

首先，在HTML页面中创建三个按钮，分别代表 "Online"、"Offline" 和 "Disconnected" 三种状态。每个按钮都应包含一个链接，该链接将状态值作为GET参数传递到当前页面。

<a href="?status=Online" class="btn">Online</a>
<a href="?status=Offline" class="btn">Offline</a>
<a href="?status=Disconnected" class="btn">Disconnected</a>

登录后复制

请注意，这里的href属性使用了?status=Online等形式，这会将状态值添加到URL中，以便PHP脚本可以读取它。

立即学习“前端免费学习笔记（深入）”；

2. 修改PHP查询语句

接下来，修改PHP代码，使其能够根据GET参数中的状态值来筛选数据库查询结果。

飞书多维表格

表格形态的AI工作流搭建工具，支持批量化的AI创作与分析任务，接入DeepSeek R1满血版

查看详情

<table id="main_table">
  <tr>
    <td>Id</td>
    <td>Agent Name</td>
    <td>Agent Rank</td>
    <td>Agent Location</td>
    <td>Status</td>
  </tr>

  <?php

  require 'CMS/processing/conn.php';

  if(isset($_GET['status'])) {
    $status = $_GET['status'];
    $result = mysqli_query($con, "SELECT * FROM agents WHERE agentStatus = '$status'");
  } else {
    $result = mysqli_query($con, "SELECT * FROM agents");
  }

  while($info = mysqli_fetch_array($result)) {
  ?>

  <tr>
    <td><?php echo $info['id']; ?></td>
    <td><?php echo $info['agentName']; ?></td>
    <td><?php echo $info['agentRank']; ?></td>
    <td><?php echo $info['locationNames']; ?></td>
    <td><?php echo $info['agentStatus']; ?></td>
  </tr>
  <?php
  }
  ?>
</table>

登录后复制

这段代码首先检查是否存在名为status的GET参数。如果存在，它将使用该值构建一个SQL查询，该查询只选择agentStatus列与GET参数值匹配的行。如果不存在，则执行一个不带任何筛选条件的查询，从而显示所有行。

3. 安全性注意事项：SQL注入

直接将GET参数的值插入到SQL查询中存在SQL注入的风险。攻击者可以通过修改URL中的GET参数来注入恶意SQL代码，从而可能损害数据库。

为了避免这种情况，应该使用预处理语句（Prepared Statements）或参数化查询。以下是使用预处理语句的示例：

<?php

require 'CMS/processing/conn.php';

if(isset($_GET['status'])) {
    $status = $_GET['status'];

    // 使用预处理语句
    $stmt = mysqli_prepare($con, "SELECT * FROM agents WHERE agentStatus = ?");
    mysqli_stmt_bind_param($stmt, "s", $status); // "s" 表示字符串类型
    mysqli_stmt_execute($stmt);
    $result = mysqli_stmt_get_result($stmt);

} else {
    $result = mysqli_query($con, "SELECT * FROM agents");
}

while($info = mysqli_fetch_array($result)) {
?>
    <tr>
        <td><?php echo $info['id']; ?></td>
        <td><?php echo $info['agentName']; ?></td>
        <td><?php echo $info['agentRank']; ?></td>
        <td><?php echo $info['locationNames']; ?></td>
        <td><?php echo $info['agentStatus']; ?></td>
    </tr>
<?php
}
?>

登录后复制

在这个例子中，mysqli_prepare()函数用于创建一个预处理语句，mysqli_stmt_bind_param()函数用于将GET参数绑定到该语句，mysqli_stmt_execute()函数用于执行该语句。这种方法可以有效地防止SQL注入，因为GET参数的值会被视为字符串，而不是SQL代码。