Javascript如何基于带值的分隔字符串选择复选框

我有类似下面的大量复选框，我想根据数据库值来选择。如果我将数据库值转储到字符串中，如DC0 | 100；DK0 | 100；DM0-SRM | 200；DR0 | 300（；分隔符或其他）。如何使用JAVASCRIPT或AJAX根据值选择复选框

下面是复选框示例：

<input type='checkbox' id='systemclient[]' name='systemclient[]' value='DB0|100' /> 
<input type='checkbox' id='systemclient[]' name='systemclient[]' value='DB5|100' /> 
<input type='checkbox' id='systemclient[]' name='systemclient[]' value='DC0|100' /> 
<input type='checkbox' id='systemclient[]' name='systemclient[]' value='DE0|100' /> 
<input type='checkbox' id='systemclient[]' name='systemclient[]' value='DG0|200' /> 
<input type='checkbox' id='systemclient[]' name='systemclient[]' value='DG0|300' /> 
<input type='checkbox' id='systemclient[]' name='systemclient[]' value='DK0|100' /> 
<input type='checkbox' id='systemclient[]' name='systemclient[]' value='DL0|200' /> 
<input type='checkbox' id='systemclient[]' name='systemclient[]' value='DL0|300' /> 
<input type='checkbox' id='systemclient[]' name='systemclient[]' value='DM0-SRM|200' /> 
<input type='checkbox' id='systemclient[]' name='systemclient[]' value='DM0-SRM|300' /> 
<input type='checkbox' id='systemclient[]' name='systemclient[]' value='DM0-SUS|210' /> 
<input type='checkbox' id='systemclient[]' name='systemclient[]' value='DM0-SUS|310' /> 
<input type='checkbox' id='systemclient[]' name='systemclient[]' value='DR0|200' /> 
<input type='checkbox' id='systemclient[]' name='systemclient[]' value='DR0|300' />
<input type='checkbox' id='systemclient[]' name='systemclient[]' value='DV0|100' /> 
<input type='checkbox' id='systemclient[]' name='systemclient[]' value='DX0|100' />

---

尝试下面的代码。请参见

var queryRes = "DC0|100;DK0|100;DM0-SRM|200;DR0|300";

// split string result by ';' char
var resArray = queryRes.split(';');

// Iterate splite items
resArray.forEach(function(item){
    // Select checkbox using value got from query and 
    // set its 'checked' attribute to TRUE
    $('input[type="checkbox"][value="' + item + '"]').attr('checked', true);
});

看这把小提琴：

---

首先，输入元素上需要唯一的id。在示例代码中，所有输入元素都具有id='systemclient[]'

我假设您的数据库中有JavaScript格式的字符串数据，只需要帮助检查与解析字符串匹配的复选框

要分析字符串，请执行以下操作：

var stringArray = myDataString.split(";");  //where ";" is the string delimiter

反复检查复选框并查找匹配项

$("input[name*='systemclient[]']").each(function(){
   console.log($(this));  //verify you're able to target the element
   if($.inArray($(this).val(), stringArray) !== -1) {
       $(this).prop('checked', true);
   } else {
       $(this).prop('checked', false);
   }
});

---

在不知道您可以使用哪些库的情况下[vanilla JS=）]您可以按所选的分隔符将字符串拆分为数组，然后迭代数组，通过dom查询查找复选框select all，然后将dom node checked属性设置为true

 var foos = str.split(';');
 foos.map(function(foo){ 
   var checkbox = document.querySelectorAll("input[type='checkbox'[value='" + foo + "']");
   checkbox.checked = true;
});

---

你应该编辑你的问题，像这样难读你们是最好的。：）加载HTML文档后如何使用相同的函数？因为复选框是在php页面加载过程中生成的。此函数仅在加载HTML之后才发生。只要确保你有JQueryTanks感谢你的帮助。谢谢你的帮助。谢谢你的帮助。

 var foos = str.split(';');
 foos.map(function(foo){ 
   var checkbox = document.querySelectorAll("input[type='checkbox'[value='" + foo + "']");
   checkbox.checked = true;
});