Question

我有一个带有许多复选框的表单，设置如下：

<input type="checkbox" id="form-436365629" value="3349" data-value="3349">
<input type="checkbox" id="form-436382959" value="60" data-value="60">
<input type="checkbox" id="form-436382959" value="2013" data-value="2013">

我还有一个简单的数字字符串，由页面内容中的空格分隔：

<span id="boat-access-id">3349 60</span>

我想将其值显示在文本字符串中的复选框设置为选中。我将如何实现？

Answer 1

您可以将每个功能$("input[type=checkbox]").each(function(index,item)用于循环复选框，.prop('checked', true)用于选中复选框

function check(){
var idstring = $('#boat-access-id').text();
var ids = idstring.split(' ');
$("input[type=checkbox]").each(function(index,item){
   //alert($(item).val());
   if(ids.indexOf($(item).val()) >= 0){
    $(item).prop('checked', true);
   }
})
}

function check(){
var idstring = $('#boat-access-id').text();
var ids = idstring.split(' ');
$("input[type=checkbox]").each(function(index,item){
   //alert($(item).val());
   if(ids.indexOf($(item).val()) >= 0){
	$(item).prop('checked', true);
   }
})
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="checkbox" id="form-436365629" value="3349" data-value="3349">
<input type="checkbox" id="form-436382959" value="60" data-value="60">
<input type="checkbox" id="form-436382959" value="2013" data-value="2013">

<p>List id to check:</p>
<span id="boat-access-id">3349 60</span>

<button onclick="check()">Check</button>

Answer 2

您可以获取跨度的text()。 trim()和split()文本将转换为数组。使用forEach()遍历数组。检查带有值的检查是否存在，如果存在，请使用prop()

进行检查

$("button").click(function() {

  $("#boat-access-id").text().trim().split(' ').forEach(function(o) {
    var cb = $('input[type="checkbox"][value="' + o + '"]');
    if (cb.length) cb.prop('checked', true);
  });

})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="checkbox" id="form-436365629" value="3349" data-value="3349">
<input type="checkbox" id="form-436382959" value="60" data-value="60">
<input type="checkbox" id="form-436382959" value="2013" data-value="2013">

<br />
<span id="boat-access-id">3349 60</span>
<button>Check</button>

根据纯文本编号设置打开/关闭复选框

2 个答案: