使用JavaScript创建多个复选框

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 s的样式可以使用position:absolute （因此它们都是可见的，但是一个在另一个之上）定义，或者display:none除了一个...

没有最小的可复制示例，很难确定。