Question

因此，我根据数据库中的内容使用纯checkboxes动态生成JS。每个复选框必须位于单独的行中，并且可以根据从数据库中提取的另一个值来检查或取消选中。为此，在我向div添加一个复选框后，我使用innerHTML属性向div添加标记。但是，现在创建的checkboxes的checked属性不起作用。如果我删除了innerHTML部分，它就可以了。

有人可以帮忙吗？这是我的代码：

var response = "Code1,Code2";

var arr = response.split(",");

var child = document.getElementById("divone");

Array.prototype.forEach.call(arr, function(a){

    var cb = document.createElement('input');
    cb.type = 'checkbox';
    cb.name = 'FunctionCode';
    cb.value = a;
    cb.id = a;
    cb.checked = true;

    var label = document.createElement('label');
    label.htmlFor = a;
    label.appendChild(document.createTextNode(a));

    child.appendChild(cb);
    child.appendChild(label);
    child.innerHTML = child.innerHTML + "<br />";
});

Answer 1

要默认选中该复选框，请使用defaultChecked = true;代替：

＆＃13;

var response = "Code1,Code2";

var arr = response.split(",");

var child = document.getElementById("divone");

Array.prototype.forEach.call(arr, function(a){

    var cb = document.createElement('input');
    cb.type = 'checkbox';
    cb.name = 'FunctionCode';
    cb.value = a;
    cb.id = a;
    // cb.checked = true;
    cb.defaultChecked = 'checked';
    var label = document.createElement('label');
    label.htmlFor = a;
    label.appendChild(document.createTextNode(a));

    child.appendChild(cb);
    child.appendChild(label);
    child.innerHTML = child.innerHTML + "<br />";
});

＆＃13;

<div id="divone"></div>

＆＃13;

Answer 2

替换

cb.checked = true;

到

cb.setAttribute('checked',true)

演示：

var response = "Code1,Code2";

var arr = response.split(",");

var child = document.getElementById("divone");

Array.prototype.forEach.call(arr, function(a){

    var cb = document.createElement('input');
    cb.type = 'checkbox';
    cb.name = 'FunctionCode';
    cb.value = a;
    cb.id = a;
   // cb.checked = true;
    cb.setAttribute('checked',true)

    var label = document.createElement('label');
    label.htmlFor = a;
    label.appendChild(document.createTextNode(a));

    child.appendChild(cb);
    child.appendChild(label);
    child.innerHTML = child.innerHTML + "<br />";
});

<div id="divone"></div>

已检查的Checkbox属性无法正常工作

2 个答案: