Question

我正在使用jQuery，并且有一个包含页面输入的集合（对象？）。我有一个变量，该变量保存循环的每次迭代的value属性。我想找到具有与变量匹配的值的输入，以便可以选中此复选框。

function reject(el) {
    const checkBox = $(el).find('input:checkbox');
    if (tempStore.checks.length > 0) {
        for (let j=0;j<tempStore.checks.length;j++) {
            $(checkBox).find("input.val("+tempStore.checks[j]+")").checked = true;
        }
    }
}

我已经在网上搜索了几个小时，找不到正确的语法。有人可以帮忙吗？

Answer 1

如果该值是在DOM中设置的，则可以尝试使用[value=""]选择器通过attribute进行选择：

let value = "A";

$('body').find('input[value="' + value + '"]').prop("checked", "checked");

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="checkbox" value="A">

请注意，您可以在代码中执行以下操作：

checkBox.filter(...)

这将提高性能，因为它将filter而不是find填充到一个已经填充的元素列表中。

另一种解决方法（不是最好的选择）是针对val()进行选择：

let $checks = $('body').find('input[type="checkbox"]'),
    value = "B";
    
$checks.each(function() {
  let $this = $(this);
  
  if ($this.val() == value) {
    $this.prop("checked", "checked");
  }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="checkbox" value="A">
<input type="checkbox" value="B">
<input type="checkbox" value="C">

Answer 2

您可以通过传递比较函数来使用filter。

// Reset state
let $checkbox = $('input:checkbox').prop('checked', false);
let valuesToCheck = ['1', '4'];

$checkbox.filter(function() {
  return valuesToCheck.includes(this.value)
}).prop('checked', true);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="checkbox" value="1">
<input type="checkbox" value="2">
<input type="checkbox" value="3">
<input type="checkbox" value="4">
<input type="checkbox" value="5">

同样，使用箭头函数语法（您不能依赖于设置“ this”）

$checkbox.filter((i, e) => valuesToCheck.includes(e.value)).prop('checked', true);

关于原始代码的一些评论：

您不需要> 0' in your if`语句，因为'0'是一个假值。
您根本不需要if，因为for中的条件永远不会成立，也永远不会运行。
在for内，您正在将jQuery集合转换为jQuery集合。不需要，只需使用checkbox。
最后，您尝试在包含find个元素的集合中input个input元素，因此您一无所获。您应该使用checkBox.filter(...)。

将它们放在一起：

function reject(el) {
    const $checkBox = $(el).find('input:checkbox');
        for (let j=0;j<tempStore.checks.length;j++) {
            $checkBox.filter((i,e) => e.value == tempStore.checks[j]).prop('checked', true)
        }
    }
}

使用变量通过值选择jQuery集合中的元素

2 个答案: