多復選框要求使用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);  
         }
     );
});