我的一个表单有八组复选框。该表单是使用 AJAX 和 jQuery 从数据库填充的。大多数复选框设置正确加载,但有四个不正确。每种情况下使用的代码似乎没有区别,经过几个小时的测试,我无法找出导致这四种情况失败的原因。
一个区别是失败的四个使用 UUID 作为值。当我将这些值更改为数字时,代码可以正常工作。但是,其他两个复选框集也使用 UUID,并且它们工作正常。失败的四个具有不同且更复杂的格式,因此我删除了格式但无济于事。
这是所有复选框的格式。此示例是从失败的复选框集之一复制的(总共有 83 个成员,但我不会向您提供完整列表):
<input id='interest1' name='interest[]' type='checkbox' value='74095951-F0EF-441C-85F4-949304FF6B89' />
<label for="interest1">Civil rights</label>
<input id='interest2' name='interest[]' type='checkbox' value='3D8A60AC-732F-4522-A9A7-7E564F16C5DA' />
<label for="interest2">Domestic violence</label>
这是设置所有复选框集状态的 jQuery 代码,其中包括有效的和无效的:
if($.isArray(value)){
for(var i = 0; i < value.length; i++){
$('input[type="checkbox"][name^="' + key + '"][value="' + value[i] + '"]').attr('checked', 'checked');
}
}
在每种情况下,value
都是一个简单的数组。
有人对我可以进行测试以确定原因有什么想法吗?
最佳答案
您可以简单地使用each
函数来迭代数组。不需要在 CSS 选择器中引用属性值,正如注释中提到的,您应该使用 prop
来设置 bool 属性,例如 checked
、disabled
等
var key = 'interest';
var value = ['74095951-F0EF-441C-85F4-949304FF6B89', '3D8A60AC-732F-4522-A9A7-7E564F16C5DA'];
$.each(value, function(i, v) {
$('input[type=checkbox][name^=' + key + '][value=' + v + ']').prop('checked', true);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input id='interest1' name='interest[]' type='checkbox' value='74095951-F0EF-441C-85F4-949304FF6B89' />
<label for="interest1">Civil rights</label>
<input id='interest2' name='interest[]' type='checkbox' value='3D8A60AC-732F-4522-A9A7-7E564F16C5DA' />
<label for="interest2">Domestic violence</label>
<input id='interest3' name='interest[]' type='checkbox' value='3D8A60AC-732F-4522-A9A7-7E564F16C5DB' />
<label for="interest3">Some other thing</label>
关于javascript - 无法使用 jQuery 填充某些复选框,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55817571/