Radio类型输入生成异常问题求助：无法获取合法输入

你的代码存在两个核心问题，导致无法生成合法的单选框输入：

1. 数组未转为纯字符串：showRadioOptions返回的是字符串数组，在Radio函数中与<br/>拼接时，数组会被自动转为逗号分隔的字符串，进而出现类似[data data]或选项间带逗号的异常。
2. 单选框属性不符合规范：所有单选框的id重复（均使用questionId），违反HTML中id必须唯一的规则；value属性未加引号，若data[i].id为字符串类型会引发语法错误。

修改后的代码： #

function showRadioOptions(questionId, data, mKey, qLevel) {
  data = data.sort((a, b) => a.orderNo - b.orderNo);
  // 用map生成单选框字符串数组，最后合并为完整HTML字符串
  return data.map((item, index) => `
    <input 
      type='radio' 
      class='showChildQuestion qid_${questionId}' 
      name='${questionId}' 
      id='${questionId}_${index}' 
      value='${item.id}' 
      data-key='${mKey}' 
      data-ishierarchy='${item.isHierarchy}' 
      data-hierarchy-question='${item.hierarchyQuestionId}' 
      data-current-question='${questionId}' 
      data-question-level='${item.questionLevel}'
    > ${item.optionText} <br/>
  `).join('');
}

function Radio(questionId, options, mKey, qLevel) {
  return "<br/>" + showRadioOptions(questionId, options, mKey, qLevel);
}

关键修改说明： #

• 用Array.map()替代循环拼接逻辑，最后通过join('')将数组转为无分隔符的完整HTML字符串，彻底解决数组转字符串时的逗号问题。
• 给每个单选框设置唯一id（${questionId}_${index}），符合HTML规范。
• 给value属性添加单引号，确保无论item.id是数字还是字符串都能正确渲染。
• 若你是在React等框架中使用，可将class改回className，原生HTML环境下保持class即可。

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