jQuery - 定位一个包含双引号的值的复选框

Question

我正在尝试预先填充一个表单，其中包含我无法更改的值的输入。其中一个字段是一系列复选框，其中一些值包含双引号来表示英寸。我有一个值数组想要更改为选中，但我不确定如何使用包含双引号的值来定位这些输入。

let sizeArr = ['short', 'under 28"', 'over 28"'];
sizeArr.forEach(function(val) {
    console.log(val);
    $(':checkbox[value='+ val +']').prop('checked', 'true');
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<label>
  Short
  <input type="checkbox" value="short" />
</label>

<label>
  Under 28"
  <input type="checkbox" value="under 28&quot;">
</label>

<label>
  Over 28"
  <input type="checkbox" value="over 28&quot;">
</label>

我也尝试直接在数组中用

"

替换双引号，但选择器似乎仍然不起作用：

let sizeArr = ['short', 'under 28"', 'over 28"'];
sizeArr.forEach(function(val) {
    console.log(val);
    $(':checkbox[value='+ val +']').prop('checked', 'true');
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<label>
  Short
  <input type="checkbox" value="short" />
</label>

<label>
  Under 28"
  <input type="checkbox" value="under 28&quot;">
</label>

<label>
  Over 28"
  <input type="checkbox" value="over 28&quot;">
</label>

Answer 1

您可以使用过滤器函数手动将元素的值与所需的值进行匹配，而不是直接将值连接到选择器字符串中。

sizeArr.forEach(function(val) {
    $(':checkbox').filter(function() {
        return $(this).val() === val;
    }).prop('checked', true);
});