jQuery如何为<tr>内除首个外的单选按钮绑定onClick事件

安全阿岳

2026-8-27

实现方式

完全可以直接绑定在<tr>元素上完成需求，不需要给每个单选按钮单独写绑定逻辑，优先用jQuery的事件委托写法，代码简洁还支持动态渲染的元素，完整实现如下：

推荐写法（事件委托，兼容性最好）

直接给id为buttonRow的表格行绑定点击事件，通过选择器匹配行内的单选按钮，事件触发时判断value值排除第一个按钮即可：

$('#buttonRow').on('click', 'input.store-privs[type="radio"]', function() {
    // 排除value=1的第一个单选按钮，其余按钮点击后执行业务逻辑
    if (Number($(this).val()) > 1) {
        // 这里替换成你需要执行的onClick业务代码
        console.log('当前点击的符合要求的按钮value值为：', $(this).val());
    }
});

这种写法的优势：

仅需在tr元素上绑定1次事件，没有重复绑定的冗余代码
后续如果在这一行内动态新增、修改单选按钮，事件依然能正常触发，不需要重新绑定
过滤规则调整灵活，后续要修改排除条件只需要改判断语句即可

对应你原有思路的补全写法

你原来的思路是先筛选符合条件的元素再绑定事件，这里要注意：children()方法只会匹配元素的直接子节点，而tr的直接子节点是td，单选按钮嵌套在td内部，所以需要用find()查找后代元素，再做过滤：

$('#buttonRow')
  .find('input.store-privs[type="radio"]') // 查找行内所有单选按钮
  .filter(function() {
    return Number($(this).val()) > 1; // 过滤出value大于1的按钮，也就是排除第一个
  })
  .on('click', function() {
    // 这里替换成你需要执行的onClick业务代码
    console.log('当前点击的符合要求的按钮value值为：', $(this).val());
  });