JSP 動態生成 Radio 群組：JavaScript 遍歷表格行獲取選中值

場景

線上評分系統，每題選項為一組 Radio，名稱動態生成（如 `q_1`, `q_2`...），無法用固定 `getElementsByName` 獲取。

解決方案：遍歷表格行，行內查找 Radio

function getRadioKV() {
    var tb = document.getElementById('scoreTable'); // 給 table 加 id
    var params = '';
    for (var i = 0; i < tb.rows.length; i++) {
        var inputs = tb.rows[i].getElementsByTagName('input');
        var selected = false;
        for (var j = 0; j < inputs.length; j++) {
            if (inputs[j].type === 'radio' && inputs[j].checked) {
                params += '&' + encodeURIComponent(inputs[j].name) + '=' + encodeURIComponent(inputs[j].value);
                selected = true;
                break; // 每行只有一個被選中
            }
        }
        if (!selected) {
            alert('第 ' + (i+1) + ' 題未作答！');
            inputs[0].focus();
            return null;
        }
    }
    return params.substring(1); // 去掉首個 &
}

// 使用
var data = getRadioKV();
if (data) {
    // AJAX 提交或表單提交
    console.log(data);
}

JSP 生成時的關鍵點

• 確保 `` 有固定 ID。
  每題選項的 Radio `name` 屬性設為唯一值（如 `name="q_${index}"`），同一題內 `name` 相同、`value` 不同。
  將題目文字放在同一行（`
  `）內，方便行遍歷定位未作答提示。

  優勢

  1. 不依賴固定 name，支援完全動態生成的題目數量與選項。
  2. 自動檢測未作答題目並定位焦點。
  3. 輸出標準 `application/x-www-form-urlencoded` 格式，後端直接 `request.getParameterMap()` 解析。

  透過 DOM 表格行遍歷，優雅解決動態 Radio 群組值收集問題。

  1. 上一篇文章： C 語言字串排序：二維陣列與指標參數錯誤修正
  2. 下一篇文章： C 語言字串解析數字群：Segmentation Fault 原因與修正
  程式設計綜合問答

  Python 中導入 pyserial 失敗：缺少 ctypes 模組解決方法

  安裝 pyserial 2.7 後，在 IDLE 執行 im

  Win7 安裝 Ubuntu 15.10 雙系統無法開機完整修復指南

  問題現象回顧 HP 新電腦，UEFI 模式安裝 Ubuntu

  三級聯動下拉菜單第三級改為可輸入文本框的實現思路與避坑指南

  需求澄清 用戶期望：幣種（一級） → 存期（二級） → 年利

  Key-Value 存儲不適合大文件：正確架構是存路徑

  誤區分析 將視頻、音頻等大文件直接作為 KV 的 Value
  POJO 與 Java 類對象的區別與關係詳解 C 語言大整數加法完整實現：分塊十進制數組模擬豎式運算 SqlConnection 連線失敗：Integrated Security 與 SQL 驗證衝突解決 爬蟲如何向網頁搜尋框注入值？三大主流方案：原生 DOM、Puppeteer/Playwright、HTTP 直POST Android 入門開發環境搭建完整清單 Java 截圖工具重截 Bug 修復：狀態標誌與事件處理優化 C 語言指針算術：*(3+doses) 為何等於 3[doses]？

  欄目導航

  組合語言

  Delphi

  Groovy

  WebSphere

  Rational

  Python 程式設計

  Ruby 程式設計

  程式設計疑難解答

  程式設計綜合問答

  更多程式設計知識

  程式設計問題解答
  Copyright © 程式碼之家 All Rights Reserved