Javascript 检查是否选中了特定复选框

我有一个带有多个复选框的表单，如下所示：

<form id="myForm">
   <input type="checkbox" id="first" />
   <input type="checkbox" id="second" />
   <input type="checkbox" id="third" />
</form>

$('#first').click(function () {
    if ($(this).prop("checked") == true) {
        alert("I'm checked!");
    }
});

---

但是对于特定的多个复选框，有没有办法做到这一点

此答案的前提是，如果您希望选中其中一个指定复选框，而不是同时选中两个复选框，则可以使用逗号分隔的选择器：

$('#first, #third')

或者通过使用类名来标识相关元素：

$('.alertIfSelectedClassName')

使用以下HTML格式：

<form id="myForm">
  <input type="checkbox" class="alertIfSelectedClassName" id="first" />
  <input type="checkbox" id="second" />
  <input type="checkbox" class="alertIfSelectedClassName" id="third" />
</form>

HTML:

---

您可以对它们进行迭代：

<form id="myForm">
    <input type="checkbox" name="somename" id="first" />
    <input type="checkbox" name="somename" id="second" />
    <input type="checkbox" name="somename" id="third" />
</form>

$('checkbox[name=somename"]').each(function () {
    if ($(this).prop("checked") == true) {
        alert("I'm checked!");
    }
});

$（'checkbox[name=somename']）。每个（函数（）{
if（$（this）.prop（“选中”）==true）{
警惕（“我被检查了！”）；
}
});

试试这个：

      $('#first, #third').click(function () {
          var firstChecked = $('#first).prop("checked") == true);
          var thirdChecked = $('#third).prop("checked") == true);
          if (firstChecked  && thirdChecked ) {
             alert("I'm checked!");
          }
       })

---

为了针对特定的元素，请尝试使用

css

类作为选择器。此外，请包含输入

type

，这样您就不会与具有相同类的其他元素发生任何冲突。 为了检查是否选中了所有必需的复选框，您可以使用

。each（）

循环并确定它们是否全部选中，并基于此显示

警报（）

。以下方法避免任何硬编码和

多个if

检查

$("input:checkbox.test").click(function()
{
    var allchecked = true;
    $("input:checkbox.test").each(function(){
        if(!$(this).is(":checked")) 
           allchecked = false;         
    });

    if(allchecked)
      alert("Im checked");
});

工作示例：

基本上：

在本例中，缓存要签入变量的项。

$toCheck

如果有，请进行快速检查。您可以通过，并将

筛选结果的长度与原始复选框集的长度进行比较

如果它们不相等，则至少有一个预期框未选中

为什么这个答案比其他答案更好？ 它是可伸缩的

---

您只需将新元素添加到

$toCheck

中，其余元素是自动的

您可以使用

检查复选框是否选中（':checked'）

，您可以使用下面的

和&

符号检查示例来检查两者是否选中

希望这有帮助

---

$（“#第一，#第三”）。单击（函数（）{
如果（$（'first'）是（'checked'）&&（'third'）。是（'checked'））
{
警报（“消息！”）；
}
})；

如果（$（'first'）是（'checked'）&&（'third'）。是（'checked'））{

@Zainab您想在两者都选中时显示警报，还是仅在其中一个选中时显示警报checked@ZakariaAcharki如果两者都被选中，那么#首先&&&#第三步您要检查输入类型=复选框，然后使用id选择器？为什么当您可以直接针对id时会感到双重痛苦？这不是我的意思。您可以简单地执行$（“#首先，#third“）。单击而不是$（“#myForm input[type=“checkbox”]”）。单击OK对于误解表示抱歉，并感谢您的干预（更新了我的答案）。此外，由于您已经在传递id选择器，您可以简单地执行$（this）。is（“：checked”）而不是$（“#first”）。is（“：checked'）&&（$（“#third”）。is（“：checked”）-删除硬编码引用和冗余。好的。这很有意义。对此很抱歉。这比迭代所有复选框的数组更具可扩展性吗？它确实会选中所有复选框，但也会迭代预定义的应选中复选框列表。这意味着如果需要选中3个复选框而不是2个复选框，则只需将其添加到$toCheck

      $('#first, #third').click(function () {
          var firstChecked = $('#first).prop("checked") == true);
          var thirdChecked = $('#third).prop("checked") == true);
          if (firstChecked  && thirdChecked ) {
             alert("I'm checked!");
          }
       })

$("input:checkbox.test").click(function()
{
    var allchecked = true;
    $("input:checkbox.test").each(function(){
        if(!$(this).is(":checked")) 
           allchecked = false;         
    });

    if(allchecked)
      alert("Im checked");
});

var $toCheck = $('#first').add('#third');
$(function () {
  $('input[type="checkbox"]').on('change', function () {


    if ( $toCheck.filter(':checked').length === $toCheck.length )
      alert('good');
    else
      alert('bad');
  })
});