求助：将Radio Button矩阵转换为数值并计算总值的实现

我来帮你搞定这个多行单选组的计算问题！首先咱们明确核心需求：每行是独立的单选组，选中后要把对应值（2/1/0）显示在该行最后一列，同时实时算出所有行的总值。

原代码的问题在于只处理了总值计算，没把每行的选中值同步到对应行的结果列，而且全局查找单选框容易干扰页面其他无关元素，咱们针对性调整：

修改后的jQuery代码 #

$(function() {
  // 给所有单选框绑定变更事件
  $(":radio").on("change", function() {
    let total = 0;
    // 遍历每一行，逐行处理
    $("tr").each(function() {
      // 获取当前行选中的单选框值
      const selectedVal = $(this).find(":radio:checked").val();
      // 把值渲染到当前行的结果列（建议给该列加类名方便定位）
      $(this).find(".row-result").text(selectedVal || 0);
      // 累加计算总值
      total += Number(selectedVal || 0);
    });
    // 更新页面上的总值显示
    $("#total").text(total);
  });
});

关键优化说明 #

• 行级精准处理：通过$("tr").each()遍历每一行，只处理当前行内的单选框，避免全局范围的无效查找
• 行内值实时渲染：给每行最后一列加个专属类名（比如row-result），确保选中值精准显示到对应行
• 鲁棒性兜底：用selectedVal || 0处理极端情况（比如单选组未默认选中时），避免计算出错
• DOM就绪再执行：把代码包裹在$(function(){})里，确保页面元素加载完成后再绑定事件，避免找不到元素

配合的HTML结构示例 #

你的表格每行最后一列需要有一个容器来显示行内结果，比如：

<table>
  <tr>
    <td><input type="radio" name="group1" value="2">选项1</td>
    <td><input type="radio" name="group1" value="1">选项2</td>
    <td><input type="radio" name="group1" value="0">选项3</td>
    <td class="row-result">0</td> <!-- 这里显示当前行的选中值 -->
  </tr>
  <!-- 其他行结构同理 -->
  <tr>
    <td colspan="4">总值: <span id="total">0</span></td>
  </tr>
</table>

这样修改后，不管用户切换哪一行的单选选项，该行的最后一列都会实时更新选中值，同时页面底部的总值也会自动累加计算啦！

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