如何使用javascript动态创建单选按钮？

我想显示存储在数组中的数据列表，并针对每个数据设置“是”和“否”单选按钮。我已经动态地生成了单选按钮，但是从所有单选按钮中，我一次只能选择一个，但是它应该是这样的，对于每个数据，我可以选择是或否。请帮助，因为我是JavaScript新手

函数displayData（）
{
var数据=[‘苹果’、‘香蕉’、‘猕猴桃’]；
var输出=”；
var output2=“”；
var数据表；
对于（变量i=0；i
'；
输出2+='是：'+'否：'+'

'；
document.getElementById（“dataList”）.innerHTML=输出；
document.getElementById（“radioBtn”）.innerHTML=output2；
}
}

---

至少在您的实现中，这不是单选按钮的作用

您必须为每个是/否选项使用无线电组名称

---

如果您通过动态名称更改

name=“box2”

HTML属性，例如

name=“box'+i+'”

，它应该可以正常工作。

至少在您的实现中，这不是单选按钮的用途

您必须为每个是/否选项使用无线电组名称

---

如果通过动态名称更改

name=“box2”

HTML属性，例如

name=“box'+i+'”

，则该属性应按预期工作。

需要为复选框的每一行指定不同的名称。请检查下面的代码

function displayData()
    {
        var data=['Apple', 'Banana', 'Kiwi'];
        var output="";
        var output2="";
        var dataList;

        for(var i=0; i< data.length; i++)
        {
            dataList=data[i];
            output+= '<input type="checkbox" value='+dataList+' name="box2'+i+'">'  + '   ' + dataList+'   '+'<br><br>';
            output2+= 'yes:<input type="radio" value="yes" name="box2'+i+'">'+'no:<input type="radio" value="yes" name="box2'+i+'">'+'<br><br>';
            document.getElementById("dataList").innerHTML=output;
            document.getElementById("radioBtn").innerHTML=output2;
        }
    }

函数displayData（）
{
var数据=[‘苹果’、‘香蕉’、‘猕猴桃’]；
var输出=”；
var output2=“”；
var数据表；
对于（变量i=0；i
'；
输出2+='是：'+'否：'+'

'；
document.getElementById（“dataList”）.innerHTML=输出；
document.getElementById（“radioBtn”）.innerHTML=output2；
}
}

您需要为复选框的每一行指定不同的名称。请检查下面的代码

function displayData()
    {
        var data=['Apple', 'Banana', 'Kiwi'];
        var output="";
        var output2="";
        var dataList;

        for(var i=0; i< data.length; i++)
        {
            dataList=data[i];
            output+= '<input type="checkbox" value='+dataList+' name="box2'+i+'">'  + '   ' + dataList+'   '+'<br><br>';
            output2+= 'yes:<input type="radio" value="yes" name="box2'+i+'">'+'no:<input type="radio" value="yes" name="box2'+i+'">'+'<br><br>';
            document.getElementById("dataList").innerHTML=output;
            document.getElementById("radioBtn").innerHTML=output2;
        }
    }

函数displayData（）
{
var数据=[‘苹果’、‘香蕉’、‘猕猴桃’]；
var输出=”；
var output2=“”；
var数据表；
对于（变量i=0；i
'；
输出2+='是：'+'否：'+'

'；
document.getElementById（“dataList”）.innerHTML=输出；
document.getElementById（“radioBtn”）.innerHTML=output2；
}
}

添加单选按钮时，请确保动态添加按钮名称

”

演示

函数displayData（）
{
var数据=[‘苹果’、‘香蕉’、‘猕猴桃’]；
var输出=”；
var output2=“”；
var数据表；
对于（变量i=0；i
'；
输出2+='是：'+'否：'+'

'；
document.getElementById（“dataList”）.innerHTML=输出；
document.getElementById（“radioBtn”）.innerHTML=output2；
}
}

---

添加单选按钮时，请确保动态添加按钮名称

”

演示

函数displayData（）
{
var数据=[‘苹果’、‘香蕉’、‘猕猴桃’]；
var输出=”；
var output2=“”；
var数据表；
对于（变量i=0；i
'；
输出2+='是：'+'否：'+'

'；
document.getElementById（“dataList”）.innerHTML=输出；
document.getElementById（“radioBtn”）.innerHTML=output2；
}
}

为什么不使用复选框？我使用复选框的目的不同，我希望用户能够为每个数据选择一个输入，无论是“是”还是“否”。for循环中的每个迭代都应该为两个名称生成两个具有相同唯一性的单选按钮，例如，您可以将i变量附加到名称：“yes:”中，分别对“no”无线电控件执行此操作。它们都具有相同的名称。为什么要在循环中而不是在循环后更改

innerHTML

？为什么不使用复选框？我使用复选框的目的不同，我希望用户能够为每个数据选择一个输入，无论是“是”还是“否”。for循环中的每个迭代都应该为两个名称生成两个具有相同唯一性的单选按钮，例如，您可以将i变量附加到名称：“yes:”中，分别对“no”无线电控件执行此操作。它们都具有相同的名称。为什么要在循环中而不是循环后更改

innerHTML

？是的，我现在知道了，非常感谢@PramodYes，我现在知道了，非常感谢@pramods