在JavaScript中动态创建复选框

我正在尝试动态创建复选框。但是我不知道这个代码有什么问题。谁来帮忙。如果您需要更多详细信息，请发表评论

$.getJSON(url, function(json) {
  console.log(json);
  console.log(json.items.length);

  for (var i = 0; i < json.items.length; i++) {

    console.log(json.items[i].name);

    var checkbox = document.createElement('input');
    checkbox.type = "checkbox";
    checkbox.name = "name" + json.items[i].name;
    checkbox.value = "value";
    checkbox.id = "id" + i;
  }
});

$.getJSON（url，函数（json）{
log（json）；
log（json.items.length）；
对于（var i=0；i

---

谢谢

您似乎从未将这些动态创建的复选框附加到DOM中，因此您在循环中创建的

复选框

变量只会被垃圾收集。如果希望这些复选框出现在某个位置，请确保实际将它们添加到DOM中：

document.body.appendChild(checkbox);

当然，与简单地将它们附加到DOM的

主体

不同，您可能希望将它们附加到某个特定元素，在这种情况下，您可能需要首先获取此元素：

var someDiv = document.getElementById('someId');
someDiv.appendChild(checkbox);

或者，如果您正在使用jQuery：

for (var i = 0; i < json.items.length; i++) {
    $('<input />', {
        type : 'checkbox',
        id: 'id' + i,
        name: 'name' + json.items[i].name,
        value: 'value'
    })
    .appendTo("#someId"); 
}

for（var i=0；i

显然，您有相应的容器来容纳这些新添加的元素：

<div id="someId"></div>

正如达林所说

您需要将动态创建的元素附加到DOM中。那么你的情况呢

        $.getJSON(url, function(json) {
        console.log(json); 
        console.log(json.items.length);

        for(var i=0;i<json.items.length;i++){

        console.log(json.items[i].name);

        var checkbox = document.createElement('input');
        checkbox.type = "checkbox";
        checkbox.name = "name"+json.items[i].name;
        checkbox.value = "value";
        checkbox.id = "id"+i;   
        document.body.appendChild(checkbox);
        }
    });

$.getJSON（url，函数（json）{
log（json）；
log（json.items.length）；
对于（var i=0；i您需要在一些html容器中添加复选框。假设您有一个id为
append
的div，如下所示

<div id="append" name="append">Append here</div>

附加在这里

并将动态创建的复选框添加到该div

js:

$.getJSON(url, function(json) {
      console.log(json);
      console.log(json.items.length);

      for (var i = 0; i < json.items.length; i++) {

            var checkbox = document.createElement('input');
            checkbox.type = "checkbox";
            checkbox.name = "name" + json.items[i].name;
            checkbox.value = "value";
            checkbox.id = "id" + i;
            document.getElementById( 'append' ).appendChild( checkbox);

      }
});

$.getJSON（url，函数（json）{
log（json）；
log（json.items.length）；
对于（var i=0；i
您没有将它们添加到文档“不知道代码出了什么问题”-您尝试过什么/失败的具体程度如何？嗯……您是否面临任何错误？或者只是复选框没有出现？您可能需要将创建的复选框附加到页面上的现有元素，如body？或某些div？也许您可以提供有关您实际遇到的问题的更多信息cing？还建议在提出新问题之前做更多的研究-google for“在Javascript中动态创建复选框”提供了几个示例，以便您可以首先查看想法在我添加复选框部分之前，我可以打印
console.log（json.items[I].name）；
。但是在添加复选框之后，该日志也没有出现。
$.getJSON(url, function(json) {
      console.log(json);
      console.log(json.items.length);

      for (var i = 0; i < json.items.length; i++) {

            var checkbox = document.createElement('input');
            checkbox.type = "checkbox";
            checkbox.name = "name" + json.items[i].name;
            checkbox.value = "value";
            checkbox.id = "id" + i;
            document.getElementById( 'append' ).appendChild( checkbox);

      }
});