具有多个名称的字段上的多个选择器 []答案

【问题标题】：Multiple selector on field with multiple name []具有多个名称的字段上的多个选择器 []
【发布时间】：2020-12-20 10:15:26
【问题描述】：

[请忽略 /close - 我在代码中犯了一个错误，但感谢所有贡献]

在我的代码中，我有许多共享相同父名称的字段。例如：

<input name="example[1_1]" type="checkbox">
<input name="example[1_2]" type="checkbox">
<input name="example[1_3]" type="checkbox">

我不知道其中哪一项是检查值。显然我可以使用一个类，但我想做的是做一个选择器，它说获取所有以 1_ 开头的字段。

我尝试了以下方法：

var answer = $('input[name^="example['+q+']"]:checked').val();
var answer = $('input[name^="example['+q+'"]:checked').val();

这真的可以用 Jquery 吗？如果没有，我将不得不重新处理我的情况，但如果有办法，我更愿意使用它。

【问题讨论】：

您的第二个选项似乎工作正常：$('input[name^="example['+q+'"]:checked') jsfiddle.net/racsdng9 - 为什么你认为它不起作用？
请记住，如果其中一个答案对您有用，请将其标记为答案，以帮助社区中的其他人在遇到相同问题时更轻松地找到他们的解决方案。 如果您不知道怎么做，您可以在答案旁边使用灰色标记（打勾）（您只能选择一个），更多信息请阅读this。否则，请告诉我们为什么提供的所有答案都不适合您。
你得出结论了吗？

标签： jquery jquery-selectors

【解决方案1】：

如果您想选中所有已选中且名称以example[1_ 开头的复选框，您可以使用

var answer = $('input[name^="example[1_"]:checked')

演示

var answer = $('input[name^="example[1_"]:checked');

console.log(answer.length)

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input name="example[1_1]" type="checkbox">
<input name="example[1_2]" type="checkbox" checked>
<input name="example[1_3]" type="checkbox">

【讨论】：

【解决方案2】：

根据jQuery attribute selector documentation，^ 选择器将是

[att^=val] 表示具有att 属性的元素，其值以前缀"val" 开头。如果"val" 是空字符串，则选择器不代表任何内容。

所以你的选择器不必包含整个括号。那么最终的选择器应该是这样的（与您提供的第二个选项相同）：

input[name^="example[' + q + '"]:checked

所以你的最终代码应该是这样的：

var q = '1_'
var answer = $('input[name^="example[' + q + '"]:checked').val();
console.log(answer)

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input name="example[1_1]" type="checkbox" value="1" />
<input name="example[1_2]" type="checkbox" value="2" checked/>
<input name="example[1_3]" type="checkbox" value="3" />

但您的问题可能无法在这里解决，因为每当您使用checked 和.val() 的组合时，它只会返回第一个匹配的元素。因此，您需要获取整个匹配元素，然后分别获取它们的值。

您可以像这样获得最终值：

var q = '1_'
var answer = $('input[name^="example[' + q + '"]:checked');
var length = answer.length;

for(var i = 0; i < length; i++) {
  console.log(answer[i].value)
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input name="example[1_1]" type="checkbox" value="1" />
<input name="example[1_2]" type="checkbox" value="2" checked />
<input name="example[1_3]" type="checkbox" value="3" checked />

【讨论】：