使用JavaScript创建多个Checkbox

Question

我想用JavaScript创建多个复选框。我尝试了以下方法：

var response= data;
        var container = document.createElement('div');
        var checkboxContainer = document.createElement('div');
        checkboxContainer.setAttribute('class', 'checkbox');
        var label;
        var checkBox;

        for(i=0;i<response.length;i++){
            label = document.createElement('label');
            checkBox = document.createElement('input');
            checkBox.type = "checkbox";
            checkBox.name = "selDates[]";
            checkBox.value = response[i]['date'];

            label.innerHTML = response[i]['date'] + " " + response[i]['typ'];
            label.appendChild(checkBox);

            checkboxContainer.appendChild(label);
            container.appendChild(checkboxContainer);
        }
        $("#downloadContent").prepend(container);

正如我在chrome开发人员工具中看到的那样，它会创建我的所有复选框，但只显示一个。显示所有标签。

如您所见，显示一个带有所有（3）标签的复选框。

在这里，您可以看到代码的打印屏幕。

为什么只显示一个复选框？为了您的信息，我使用Bootstrap 3和jQuery。

感谢您的帮助！

Yanick

Answer 1

Javascript似乎没问题（除了可能每次都在循环中添加checkboxContainer）。

一种可能性是CSS使其他复选框不可见。

例如，label的样式可以使用position:absolute定义（因此所有样式都可见，但一个在另一个之上）或display:none除了一个......

如果没有最小的可重复性示例，很难确定。