Question

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

问题

我无法取消选中之前用户取消选中的日期。或者我说我只想显示已选中的已检查日期，并且要取消选中未使用检查的日期。

到目前为止尝试了什么？

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

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

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

＆＃13;

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

＆＃13;

<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>

＆＃13;

Answer 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>

取消选中Checkbox，同时循环将数组放入for循环中

1 个答案: