Проверенное свойство Checkbox не работает

Итак, я динамически генерирую checkboxes, используя чистый JS, на основе содержимого в базе данных. Каждый флажок должен располагаться в отдельной строке, и его можно устанавливать или снимать в зависимости от другого значения, полученного из базы данных. Для этого после добавления флажка к div я добавляю тег к div, используя свойство innerHTML. Но теперь проверяемое свойство созданного checkboxes не работает. Он работает, если я удалю часть 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 />";
});

почему вы используете Array.prototype.forEach.call(arr ... когда arr явно является реальным массивом?

— 06.04.2018 05:26

cb.setAttribute('checked', 'checked'); вместо cb.checked=true будет работать ... или ... child.appendChild(document.createElement('br')) вместо материала innerHTML

— 06.04.2018 05:30

Я попробовал child.appendChild (document.createElement ('br')), но это не сработало. Вот почему я перешел на это.

— 06.04.2018 05:51

это работает, возможно, вы ошиблись

— 06.04.2018 05:52

javascript html

06.04.2018 05:26

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией

В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.

Концепция локализации и ее применение в приложениях React ⚡️

Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...

Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer

В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...

Безумие обратных вызовов в javascript [JS]

Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...

Система управления парковками с использованием HTML, CSS и JavaScript

Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...

JavaScript Вопросы с множественным выбором и ответы

Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...

226

Перейти к ответу Данный вопрос помечен как решенный

Ответы 2

чтобы установить флажок по умолчанию, используйте вместо него defaultChecked = 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.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 />";
});

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

Я не хочу, чтобы он был установлен по умолчанию. Только если выполняется определенное условие, его следует проверять.

— 06.04.2018 06:01

вы могли бы добавить условие, например if (something) { cb.defaultChecked ..., и не упомянули ни одного условия в своем вопросе.

— 06.04.2018 06:04

06.04.2018 05:32

Ответ принят как подходящий

заменять

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 />";
});