选择多个ID - 必须选择两个复选框

有没有办法在做某事之前需要检查两个或多个ID。选择多个ID - 必须选择两个复选框

例如：

如果BOTH 复选框 1和复选框2进行检查，则事件发生。

但是，如果只有1个或另一个被自己检查，则会发生其他事情。

我认为这会工作，但不是。

function toggleStatus() { 
    if ($('#checkbox1 #checkbox2').is(':checked')) { 
$('.option1 :input').attr('checked', true); 
    } else { 
$('.option1 :input').attr('checked', false); 
} 

function toggleStatus() { 
    if ($('#checkbox1').is(':checked')) { 
$('.option2 :input').attr('checked', true); 
    } else { 
$('.option2 :input').attr('checked', false); 
} 

function toggleStatus() { 
    if ($('#checkbox2').is(':checked')) { 
$('.option3 :input').attr('checked', true); 
    } else { 
$('.option3 :input').attr('checked', false); 
}

希望我解释正确。我找了三天，我被卡住了。谢谢你的帮助！

来源

2010-07-06 Mark H

我会给复选框一个普通的类。然后将其用作选择器并对选中的值进行计数。然后如果两个被检查做一些事情。如果检查一个，然后检查那个值，并做相应的处理。

编辑：所以说，比如你分配一个公用类myCheckBoxes

所以，你可以做以下的伪代码：

var myCheckBoxes = $('.myCheckBoxes:checked') //not sure on selector 

if (myCheckBoxes.length == 2) 
    //do something because both are checked 
else if (myCheckBoxes.length == 1) 
{ 
    if (myCheckBoxes.val() == "A") 
     // do something because A was checked 
    else if (myCheckBoxes.val() == "B") 
     // do something because B was checked 
}

来源

2010-07-06 22:52:26 spinon

，你需要从你的选择中删除的空间。 – user113716 2010-07-06 23:00:13

@帕特里克噢，没有注意到。谢谢 – spinon 2010-07-06 23:16:43

这是一个很好的解决方案，但它可能不可读。如果你没有描述片段试图做什么 – GerManson 2010-07-07 00:26:36

$('#checkbox1, #checkbox2').change(function() { 
    if ($('#checkbox1').is(':checked') && $('#checkbox2').is(':checked')) { 
     // Do some stuff if both boxes are checked... 
    } 
});

来源

2010-07-06 22:55:17

谢谢。这工作像一个魅力。当我有更多时间时，我会研究其他解决方案。 – 2010-07-07 01:09:32

+14

如果这解决了您的解决方案，您应该将其标记为您的问题的答案。 – 2012-04-10 00:06:03

你也可以使用jQuery add（）方法，但是这在大多数情况下最好。 – 2012-05-01 16:59:16

$(document).ready(function() { 
    var check1 = $("#check1"); 
    var check2 = $("#check2"); 

    // this method decides what to do when a checkbox is clicked 
    var trigger_event = function() { 
     if (check1.attr("checked") && check2.attr("checked")) { 
      event1(); 
     } 
     else if (check1.attr("checked") && !check2.attr("checked")) { 
      event2(); 
     } 
     else if (!check1.attr("checked") && check2.attr("checked")) { 
      event3(); 
     } 
    }; 

    // append event 
    check1.click(function() { 
     trigger_event(); 
    }); 

    check2.click(function() { 
     trigger_event(); 
    }); 

};

来源

2010-07-07 00:27:17 GerManson

谢谢大家！我会尝试这些并发布我在这里使用的。 – 2010-07-07 01:01:28

不要忘记标记为答案最好的解决方案 – GerManson 2010-07-07 01:47:46

var ids = ['#checkbox1', '#checkbox2'], 
    $chx = $(ids.join(',')), 
    count = $chx.length; 

$chx.on('change', function() { 
    if ($chx.filter(':checked').length === count) { 
     // do stuff 
     console.log('all true'); 
    } 
});

如果复选框是被一些元素包裹：

<div class="check-group"> 
    <label><input id="checkbox1" type="checkbox"> one </label> 
    <label><input id="checkbox2" type="checkbox"> two </label> 
</div>

然后缠绕元件可以有事件侦听器：

$('.check-group').each(function() { 

    var $this = $(this), 
     $chx = $this.find('input[type=checkbox]'), 
     count = $chx.length; 

    if (count === 0) { 
     return; 
    } 

    $this.on('change', function() { 
     if (count === $chx.filter(':checked').length) { 
      console.log('all checked'); 
     } 
    }); 
});

来源

2012-12-12 11:31:07 tiffon

我会给两个（或像你一样多）同一类=“chk_option”。当您在点击事件定义为每个简单的做到这些

function isSelectedBoth(){ 
    var result = true; 
    $('.chk_option').each(function(){ 
     if(!$(this).is(':checked')) 
      result=false; 
    }); 
    return result; 
}

：

$('.chk_option').change(function(e){ 
    if (isSelectedBoth()){ 
    // do something if both are selected 
     alert('both checkboxes are selected'); 
    }else{ 
    // do something if not 
     alert('You must select both checkboxes'); 
    } 
});

，你甚至可以用更智能的功能做到这一点，然后isSelectedBoth如果您正在使用jQuery，那么你可以这样做（）它可以返回一些更有用的信息，然后是真/假，比如un/checked box的订单号码，un/checked元素的数组等。

来源

2012-12-12 13:08:32 Sasa

布尔逻辑ftw！所以我很确定你正在寻找所谓的独家或XOR。这意味着如果只有一个操作数是真的，那么整个表达式就是真的。如果两个操作数都不为真，或者两者均为真，则整个表达式将评估为假。这个运营商是^。因此，这里的代码（借用克里斯为基本格式）...

$('#checkbox1, #checkbox2').change(function() { 
    if($('#checkbox1').is(':checked') && $('#checkbox2').is(':checked')) { 
     // Both are checked 
    } 
    else if($('#checkbox1').is(':checked')^$('#checkbox2').is(':checked')) { 
     // Exactly one is checked 
    } 
});

在现实中，你因为我们使用else if和第一if只需要一个或第二if盖当两者都检查。但它并不那么酷，显然不能用它来做同样的事情（并且更好地减少咳嗽咳嗽*）。

享受！

来源

2012-12-13 06:36:05 Pluto

有在你的代码的两个问题：

你使用$('#checkbox1 #checkbox2')选择两个复选框，但没有一个逗号这是一个“ancestor descendant” selector而不是multiple selector
is()运算符返回true如果至少有一个匹配给定的参数。所以，如果你使用if ($('#checkbox1, #checkbox2').is(':checked'))，只要任何一个（但不一定是两者）复选框被选中

因此，为了做一些事情的时候两个复选框被选中，你需要在两个分开使用is(':checked')这是真的如在the top-voted answer中所述。

下面是一个演示展示假设`.myCheckBoxes`指复选框自己is()行为

$('input').on('change', function(ev) { 
 
    if ($('#checkbox1, #checkbox2').is(':checked')) { 
 
    console.log("is(':checked') true because at least one is checked"); 
 
    } else { 
 
    console.log("is(':checked') not true"); 
 
    }; 
 
    if ($('#checkbox1').is(':checked') && $('#checkbox2').is(':checked')) { 
 
    console.log("both checked"); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<label><input type="checkbox" id="checkbox1"/>checkbox1<label> 
 
<label><input type="checkbox" id="checkbox2"/>checkbox2</label>

来源

2017-06-21 19:37:44 user2314737

选择多个ID - 必须选择两个复选框

回答

相关问题