javascript - HTML : JSON To different group of radio buttons

Question

比方说，我有一个 JS 对象。看起来像:

var basicRadioStructure = 
{
  4 : "Option 1" 
  5 : "Option 2"
  6 : "Option 3"
};

比方说，我有一个数组:

var radioValuesForEachGroup = [4,5,6];

在这种情况下，单选按钮组的数量是数组的大小，其中每组:

• 4 表示选项 1 已选中
• 5 表示选项 2 已选中
• 6 表示选项 3 已选中

根据 basicRadioStructure 对象中定义的值。我想要的是遍历数组 radioValuesForEachGroup 并制作这样的单选按钮:

当遍历 radioValuesForEachGroup 数组且值为 4 时，它应该生成这种 radio 组 选中选项 1 的地方:

<input type="radio" name="group0" value="4" checked> Option 1<br>
<input type="radio" name="group0" value="5"> Option 2<br>
<input type="radio" name="group0" value="6"> Option 3

当 value = 5 时，应检查选项 2 :

<input type="radio" name="group1" value="4" > Option 1<br>
<input type="radio" name="group1" value="5" checked> Option 2<br>
<input type="radio" name="group1" value="6"> Option 3

当 value = 6 时，应检查选项 3 :

<input type="radio" name="group2" value="4" > Option 1<br>
<input type="radio" name="group2" value="5"> Option 2<br>
<input type="radio" name="group2" value="6" checked> Option 3

从 JavaScript/jQuery 生成所有这些 radio 组后，我想将它们显示在下面的这个 div 中:

<div id="Radios">
</div>

我应该如何解决这个问题？

Answer 1

这会起作用。

var options = {
  "4" : "Option 1",
  "5" : "Option 2",
  "6" : "Option 3"
};
var ValForGroup = ["4","5","6"];
var l = Object.keys(options).length;
Object.keys(options).forEach(function (item) {
  for(var a =0;a<l;a++){
    if(ValForGroup[a] == item)
    {   
      $("body").append("<input type='radio' name='group"+item+"' value='"+options[item]+"' checked>"+options[item]);
     
    }
    else{
      $("body").append("<input type='radio' name='group"+item+"' value='"+options[item]+"' >"+options[item]);
    }
}
$("body").append("<br>");
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>