Question

我正在尝试向表单添加复选框列表。当我使用下面的代码时，我得到了数组中的所有项目但没有复选框，所以我无法选择任何内容。我确信这有一个非常简单的解决方案，但我无法看到我做错了什么（我是新手）。非常感谢您的帮助。这是代码：

var check_value = new Array()
check_value[0] = "I work at home"
check_value[1] = "Train/Subway"
check_value[2] = "Walk"
check_value[3] = "Bicycle"

for(count in check_value)
    {
    var ptworkinfo=document.createElement("input");
    ptworkinfo.type="checkbox";
    ptworkinfo=(check_value[count] + "</br>");
    ptworkinfo.id="ptworkinfo";
    document.write(ptworkinfo);
    count+=count;
    }

Answer 1

这里有几个问题：

1）永远不要使用document.write - 您需要使用的标准纯javascript实现是 appendChild 到父元素。例如：

var parentElement = document.getElementById('myParentElement');

if(parentElement != null)
   parentElement.appendChild(myChildElement);

2）使用这些知识，您可以通过简单的语句返工轻松添加元素：

var parentElement = document.getElementById('myParentElement');

for(var count in check_value)
{
    var newCheckBox = document.createElement('input');
    newCheckBox.type = 'checkbox';
    newCheckBox.id = 'ptworkinfo' + count; // need unique Ids!
    newCheckBox.value = check_value[count] + '<br/>';

    parentElement.appendChild(newCheckBox);
}

Answer 2

看起来你只是忘了把.value放在你的一条线上。相反，它会将您创建的变量覆盖为带有字符串的输入框。

...
    ptworkinfo.value =(check_value[count] + "</br>");
...

Answer 3

以下是根据上述建议更新的新代码（谢谢）。我现在得到一行复选框，旁边没有文字。另外，奇怪的是，每个复选框后也没有中断。它就像“ptworkinfo.value =（check_value [count] +'＆lt; br /＆gt;'）;”只是没有通过。有什么想法/建议？

var residence = document.getElementById('residence');

var check_value = new Array( )
check_value[0] = "I work at home"
check_value[1] = "Train/Subway"
check_value[2] = "Walk"
check_value[3] = "Bicycle"

for(var count in check_value)
    {
    var ptworkinfo=document.createElement("input");   
    ptworkinfo.value=(check_value[count] + '</br>');
    ptworkinfo.type="checkbox";
    ptworkinfo.id="ptworkinfo" + count;
    residence.appendChild(ptworkinfo);
    }

Answer 4

首先创建类型为input的元素。然后将其类型属性设置为复选框。可以通过以下两种方式中的任何一种来完成。

const checkBox = document.createElement('input')
checkBox.type = 'checkbox'

还可以使用setAttribute函数设置属性。第一个参数指出要更新的属性。这里的type属性更新为复选框的类型。

checkBox.setAttribute('type','checkbox')

javascript复选框创建元素

4 个答案: