флажки проверены на основе входного значения

Question

у меня есть четыре флажка и такой вход

<input type="text" value="" class=" windows ">

У меня есть этот вход: 1010

после разделения у меня есть 1, 0, 1, 0

я хочучтобы проверить, является ли ввод 1, установите флажок, если 0 установите флажки не отмеченными.я пробовал это:

$(':checkbox').prop('checked', this.checked);

но это делает все флажки отмечены!
любые идеи, пожалуйста.

Answer 1

Это должно сработать.Когда длина значения ввода равна количеству флажков, он включает правильные значения на основе введенного числа.

Поскольку число 0 равно false в javascript, а другие числаtrue мы можем сказать .checked = parseInt(val[i]) внутри цикла for.

Рекомендуется ограничить ввод, чтобы можно было набирать не более 4 символов и принимать только 0 и 1.

$('.input-cb').on('input', function(){
  var val = $(this).val();
  if(val.length === $('.target-cb').length) {
    for(var i = 0; i < val.length; i++) {
      $('.target-cb').get(i).checked = parseInt(val[i]);
    }
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" value="" class="windows input-cb">
<div id="cb-wrapper">
  <input type="checkbox" value="" class="windows target-cb">
  <input type="checkbox" value="" class="windows target-cb">
  <input type="checkbox" value="" class="windows target-cb">
  <input type="checkbox" value="" class="windows target-cb">
</div>

Answer 2

Вы можете использовать функцию обратного вызова prop :

$(':checkbox').prop('checked', function(index) {
   return +yourArray[index] === 1;
});

Answer 3

Вы можете перебирать флажки и отмечать / снимать каждый из них на основе значения 1/0.

EG:

<input type="checkbox" class="myCheckboxes" />
<input type="checkbox" class="myCheckboxes" />
<input type="checkbox" class="myCheckboxes" />
<input type="checkbox" class="myCheckboxes" />
<input type="checkbox" class="myCheckboxes" />

<script>
    var arrayFromInput = [ 1, 0, 1, 0 ];

    var checkBoxes = document.getElementsByClassName('myCheckboxes');

    for(var i=0; i<checkBoxes.length; i++)
    {
        if(i > arrayFromInput.length)
        {
            break;
        }

        checkBoxes[i].checked = arrayFromInput[i];
    }


</script>