如何用jQuery获取表格中选中复选框的值？附PHP代码示例

首先提个小细节：你当前的HTML表格结构有问题——循环里把每个条目的复选框和标题拆成了两个独立的<tr>，这会导致表格布局错乱，应该把同一行的内容放在同一个<tr>里。先给你修正后的PHP生成HTML的代码：

<table class="table datatable-basic">
  <tr>
    <th>-</th>
    <th>title</th>
  </tr>
  <!-- 假设你的循环是遍历目标数据数组，可根据实际情况调整变量名 -->
  <?php foreach ($targetDataArray as $item): ?>
  <tr>
    <td><input class="chk" type="checkbox" name="uid[]" value="<?php echo $item['id']; ?>"></td>
    <td><?php echo $item['title']; ?></td>
  </tr>
  <?php endforeach; ?>
</table>
<button id="go">GO</button>

接下来就是实现点击GO按钮获取选中值的jQuery代码，步骤很清晰：

1. 先确保你已经引入了jQuery库（如果还没加，在页面底部添加这行即可）：

<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>

2. 然后添加处理点击事件的脚本：

$(document).ready(function() {
    // 绑定GO按钮的点击事件
    $('#go').click(function() {
        // 初始化数组存储选中的ID
        let selectedUids = [];
        
        // 遍历所有被勾选的.chk复选框，收集它们的value值
        $('.chk:checked').each(function() {
            selectedUids.push($(this).val());
        });
        
        // 根据收集结果给出对应提示
        if (selectedUids.length === 0) {
            alert('还没有选中任何项哦！');
        } else {
            alert('你选中的ID是：' + selectedUids.join(', '));
            // 要是需要在控制台查看详细的数组数据，也可以加上这行
            console.log('选中的ID数组：', selectedUids);
        }
    });
});

代码说明： #

• $(document).ready()：确保DOM元素全部加载完成后再执行脚本，避免出现找不到按钮或复选框的情况
• $('#go').click(...)：监听GO按钮的点击动作
• $('.chk:checked')：精准选择所有被勾选的、带有.chk类的复选框
• .each()：遍历选中的复选框，把每个的value（也就是PHP输出的$id）存入数组
• 最后判断数组长度，给出对应的提示：没有选中时提醒用户，选中则展示所有选中的ID

内容的提问来源于stack exchange，提问作者c319113