多复选框要求使用jQuery启用禁用下拉框

Question

因此，首先我进行了搜索，然后在jquery中找到了“ 启用/禁用”下拉框 ，这使我处于正确的轨道。 我是jquery新手，因此在查看其他代码时，我可以对其进行调整以适合我并适合我。

所以我要问的是如何使它检查两个复选框的条件是否为真？

<script>
    $(document).ready(function() {
         $("#box1").click(function() {
           if ($(this).is(":checked")) {
              $("#tech1").prop("disabled", false);
           } else {
              $("#tech1").prop("disabled", true);  
           }
         });
        });
</script>

我希望如果选中box1和box2启用此框？ 我了解您可以使用if语句来执行此操作，但是我不确定它的确切位置。 提前致谢。

这项工作会：

$("#box1").click(function() {
    if ($(this).is(":checked")) &&
$("#box2").click(function() {
    if ($(this).is(":checked"))

我不工作，我认为那是因为上面创建了两个函数，而不是我需要的if语句。

Answer 1

将两者都包含在事件处理程序中，并检查是否都选中

$(document).ready(function() {
    var boxes = $("#box1, #box2");

    boxes.on('change',  function() {

       var disabled = boxes.filter(':checked').length === boxes.length;

       $("#tech1").prop("disabled", disabled);

    });
});

小提琴

Answer 2

考虑使用CSS类框定义的box1和box2复选框，如下所示：

<input type="checkbox" id="box1" class="boxes" />
<input type="checkbox" id="box2" class="boxes" />

现在，您可以将box类用作jquery选择器来执行任务

<script>
$(document).ready(function() {
    $(".boxes").click(function(){
         if($(".boxes:checked").size() == $(".boxes").size()){
            $("#tech1").prop("disabled", false);
         }else{
            $("#tech1").prop("disabled", true);  
         }
     );
});