在for循环中循环遍历数组时取消选中复选框答案

【问题标题】：Unchecked the Checkbox while looping threw array in for loop在for循环中循环遍历数组时取消选中复选框
【发布时间】：2017-12-01 07:41:18
【问题描述】：

我有所有工作日的复选框。用户只需取消选中他/她不想检查的日期。我将数据库中逗号分隔的字符串中的日期保存为1,2,4,5。我从数据库中正确取回字符串。

问题

我无法取消选中用户之前取消选中的日期。或者我说我只想将选中的日期显示为已选中，并希望取消选中未通过使用选中的日期。

到目前为止有什么尝试？

我使用split从字符串创建了一个数组。

得到一个数组后，我使用 For 循环取消选中该复选框，但它不起作用。

但是我的星期一复选框被取消选中。

var working_day_string = '1,2,4,5'; 
var working_day_array = working_day_string.split(',');

for (i=0;i<working_day_array.length;i++)
{ 
   if(working_day_array[i] != '1'){
       $('#monday').prop('checked', false);
   }
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="col-lg-10">
	<div class="checkbox checkbox-custom checkbox-inline">
		<input type="checkbox" id="monday" name="working_days[]" value="1" checked>
		<label for="monday"> Monday </label>
	</div>

	<div class="checkbox checkbox-custom checkbox-inline">
		<input type="checkbox" id="tuesday" name="working_days[]" value="2" checked>
		<label for="tuesday"> Tuesday  </label>
	</div>

	<div class="checkbox checkbox-custom checkbox-inline">
		<input type="checkbox" id="wednesday" name="working_days[]" value="3" checked>
		<label for="wednesday"> Wednesday  </label>
	</div>

	<div class="checkbox checkbox-custom checkbox-inline">
		<input type="checkbox" id="thursday" name="working_days[]" value="4" checked>
		<label for="thursday"> Thursday </label>
	</div>
	<div class="checkbox checkbox-custom checkbox-inline">
		<input type="checkbox" id="friday" name="working_days[]" value="5" checked>
		<label for="friday"> Friday  </label>
	</div>
	<div class="checkbox checkbox-custom checkbox-inline">
		<input type="checkbox" id="saturday" name="working_days[]" value="6" checked>
		<label for="saturday"> Saturday  </label>
	</div>
	<div class="checkbox checkbox-custom checkbox-inline">
		<input type="checkbox" id="sunday" name="working_days[]" value="7" checked>
		<label for="sunday"> Sunday  </label>
	</div>
</div>

【问题讨论】：

working_day_array[i] != '1' ? $('#monday').prop('checked', false) : ''; 应该是 if (...) { ... } 而不是滥用的条件/三元运算符
对不起先生，@Andreas 我没有正确理解您，您能否详细说明您在说什么。谢谢
条件/三元运算符旨在根据第一部分中的条件返回两个值之一。您的脚本确实“返回”了一个值，但您没有使用它。相反，?: 运算符的唯一操作是设置 DOM 节点的属性，因此这应该使用简单的 if 来完成：if (working_day_array[i] != '1') { $('#monday').prop('checked', false); }
谢谢@Andreas 我一定会记住这一点。我也编辑了我的问题。

标签： jquery arrays for-loop checkbox

【解决方案1】：

试试下面的

var working_day_string = '1,2,4,5';
var working_day_array = working_day_string.split(',');
$('input[type="checkbox"]').prop('checked', false); //reset all checkboxes
$.each(working_day_array, function(i, day) {
  $('input[value="' + day + '"]').prop('checked', true); //check the box from the array, note: you need to add a class to your checkbox group to only select the checkboxes, right now it selects all input elements that have the values in the array 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="col-lg-10">

    <div class="checkbox checkbox-custom checkbox-inline">
        <input type="checkbox" id="monday" name="working_days[]" value="1" checked>
        <label for="monday"> Monday </label>
    </div>

    <div class="checkbox checkbox-custom checkbox-inline">
        <input type="checkbox" id="tuesday" name="working_days[]" value="2" checked>
        <label for="tuesday"> Tuesday  </label>
    </div>

    <div class="checkbox checkbox-custom checkbox-inline">
        <input type="checkbox" id="wednesday" name="working_days[]" value="3" checked>
        <label for="wednesday"> Wednesday  </label>
    </div>

    <div class="checkbox checkbox-custom checkbox-inline">
        <input type="checkbox" id="thursday" name="working_days[]" value="4" checked>
        <label for="thursday"> Thursday </label>
    </div>
    <div class="checkbox checkbox-custom checkbox-inline">
        <input type="checkbox" id="friday" name="working_days[]" value="5" checked>
        <label for="friday"> Friday  </label>
    </div>
    <div class="checkbox checkbox-custom checkbox-inline">
        <input type="checkbox" id="saturday" name="working_days[]" value="6" checked>
        <label for="saturday"> Saturday  </label>
    </div>
    <div class="checkbox checkbox-custom checkbox-inline">
        <input type="checkbox" id="sunday" name="working_days[]" value="7" checked>
        <label for="sunday"> Sunday  </label>
    </div>

</div>

【讨论】：