检查是否至少使用 jQuery 选中了一个复选框

Question

我有五个复选框。 使用 jQuery，如何检查是否至少检查了其中之一？

<input type="checkbox" name="service[]">
<br />
<input type="checkbox" name="service[]">
<br />
<input type="checkbox" name="service[]">
<br />
<input type="checkbox" name="service[]">
<br />
<input type="checkbox" name="service[]">

Answer 1

is()可以做到这一点，并且可以说is(":checked")唯一可以接受的用法：

从 jQuery 文档， http : //api.jquery.com/is/ ：

根据选择器、元素或 jQuery 对象检查当前匹配的一组元素，如果这些元素中至少有一个与给定的参数匹配，则返回 true。

 alert($("input[name='service[]']").is(":checked"));

示例： http : //jsfiddle.net/AndyE/bytVX/1/ （基于Brandon Gano的小提琴）

或者，可能更快，您可以将函数传递给is() ：

$("input[name='service[]']").is(function () {
    return this.checked;
});

Answer 2

编辑：此答案中的原始解决方案效率低下，不应使用。 请参阅基于对此问题的其他答案的评论和示例的修订解决方案。

原始（坏）解决方案如下：

// DO NOT USE; SEE BELOW
$('button').click(function () {
  var atLeastOneIsChecked = false;
  $('input:checkbox').each(function () {
    if ($(this).is(':checked')) {
      atLeastOneIsChecked = true;
      // Stop .each from processing any more items
      return false;
    }
  });
  // Do something with atLeastOneIsChecked
});

在这个例子中 .each() 的使用是多余的，因为 .is() 可以直接在一组对象上使用，而不是手动迭代每个对象。 一个更有效的解决方案如下：

$('button').click(function () {
  var atLeastOneIsChecked = $('input:checkbox').is(':checked');
  // Do something with atLeastOneIsChecked
});

请注意，其中一条评论表明非常不喜欢$(this).is(':checked') 。 澄清is(':checked') ，在您测试一组对象的情况下， is(':checked')没有任何问题。 也就是说，在单个项目上调用is(':checked')比在同一项目上调用.checked效率低得多。 它还涉及对 $ 函数的不必要调用。

Answer 3

这应该可以解决问题：

function isOneChecked() {
    return ($('[name="service[]"]:checked').length > 0);
}

Answer 4

另一个答案：

!!$("[type=checkbox]:checked").length

要么

!!$("[name=service[]]:checked").length

这取决于你想要什么。

Answer 5

你应该像这样尝试......

var checkboxes = $("input[type='checkbox']"),
submitButt = $("input[type='submit']");

checkboxes.click(function() {
submitButt.attr("disabled", !checkboxes.is(":checked"));

});

Answer 6

您需要检查复选框是否被选中。

$("#select_all").click(function(){
           var checkboxes = $("input[type='checkbox']");
           if(checkboxes.is(":checked"))
               alert("checked");
           else
               alert("select at least one;      

            });

Answer 7

var checkboxes = document.getElementsByName("service[]");
if ([].some.call(checkboxes, function () { return this.checked; })) {
  // code
}

您想要的很简单，获取所有具有名称的元素，然后在检查其中一些元素时运行一些代码。

不需要 jQuery。

不过，对于旧版浏览器，您可能需要 ES5 垫片

Answer 8

您可以通过以下方式进行。 最初设置一个变量，假设checked为false 。 如果满足以下条件，则将其设置为true 。 使用if语句检查变量。 注意：这里submit是id按钮， main是形式的ID。

 $("#submit").click(function() { var checked = false; if (jQuery('#main input[type=checkbox]:checked').length) { checked = true; } if (!checked) { //Do something } });

Answer 9

方括号[]不是必需的：

var atLeastOneIsChecked = $("input[name='service']:checked").length > 0;

您的 HTML 也是如此，但最好有一个id来唯一标识每个复选框：

<input id="chk1" type="checkbox" name="service">
<br />
<input id="chk2" type="checkbox" name="service">
<br />
<input id="chk3" type="checkbox" name="service">
<br />
<input id="chk4" type="checkbox" name="service">
<br />
<input id="chk5" type="checkbox" name="service">

Answer 10

var atLeastOneIsChecked = $('input[name="service[]"]:checked').length > 0;