Disable divs mit Kontrollkästchen mit Klasse Ansatz

Question

Ich habe eine Kombination von Divs und Kontrollkästchen. In jedem Div gibt es Textfelder und Optionsfelder. Also auf der obersten Ebene, wenn ich ein beliebiges div deaktivieren möchte, sollte ich dies mit dem div entsprechenden Kontrollkästchen tun können.

Ich habe JQuery dazu geschrieben, aber wenn ich Kontrollkästchen für ein div ein- oder auschecke, wirkt sich das auch auf ein anderes div und dessen Inhalt aus. Daher möchte ich einen klassenbasierten Ansatz, um diese Funktionalität zu erhalten. Auch beim Laden der Seite sollten die div-Inhalte deaktiviert sein. Danke

$(".disableDivCheckbox").click(function() { 
     $(".disableDiv *").prop("disabled", !this.checked); 
    }); 

Answer 1

Refr dieser Code funktioniert gut.

<script> 
    $(function() { 
     $("#chkPassport").click(function() { 
      if ($(this).is(":checked")) { 
      $("#dvPassport").show(); 
      } else { 
      $("#dvPassport").hide(); 
      } 
     }); 
    }); 

</script> 

//html/php code 


    <div class="form-group col-sm-12"> 
       <label class="form-group col-sm-3"> 
<input type="checkbox" id="chkPassport" name="chkPassport" value="first_checkbox">Add Payment</label> 

       <div id="dvPassport" style="display: none"> 

        <label class="form-group col-sm-12">Payment Type</label> 
       </div> 
        <div class="col-sm-4"> 
       <?php 
        $stmt = $conn->prepare('Select pay_type_name from tbl_payment_type'); 
        $stmt->execute(); 
        $result = $stmt->fetchAll(); 
        print '<select class="col-sm-11" name="pay_type_name" id="pay_type_name">'; 
        foreach ($result as $row) { 
        print "<option value=".$row['pay_type_name'].">".$row['pay_type_name']."</option>"; 
        } 
        print '</select>';    
       ?> 
        </div> 
        </div>