在HTML表格中通过选择框联动获取同行的不同单元格数据-js教程-PHP中文网

在HTML表格中通过选择框联动获取同行的不同单元格数据

花韻仙語

发布： 2025-09-21 10:11:31

原创

960人浏览过

在html表格中通过选择框联动获取同行的不同单元格数据

本教程详细讲解了如何在HTML表格中，当用户在一个内的下拉框展示。

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<table class="table">
  <thead>
    <tr>
      <th scope="col">Hostname</th>
      <th scope="col">User</th>
      <th scope="col">Vulnerabilities</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td class="Rechnernummer">
        <a href="javascript:void(0)" onclick="clientInfo(event);">Host001</a>
      </td>
      <td class="User">User001</td>
      <td class="Vulnerabilites">
        <select class="form-select" size="4">
          <option value="2705">Security Vulnerability CVE-2018-1285 for log4net</option>
          <option value="73562">Security Vulnerability CVE-2022-39427 in VirtualBox</option>
        </select>
      </td>
    </tr>
    <tr>
      <td class="Rechnernummer">
        <a href="javascript:void(0)" onclick="clientInfo(event);">Host002</a>
      </td>
      <td class="User">User002</td>
      <td class="Vulnerabilites">
        <select class="form-select" size="4">
          <option value="68069">Security Vulnerability CVE-2021-34803 for TeamViewer</option>
          <option value="74465">Security Vulnerability CVE-2023-21899 in VirtualBox</option>
        </select>
      </td>
    </tr>
  </tbody>
</table>

登录后复制

在这个结构中：

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