Question

我有div和复选框的组合。在每个div中都有文本框和单选按钮。所以在顶层，如果我想禁用任何div，我应该可以使用与该div相对应的复选框。

我已经编写了JQuery，但如果我选中或取消选中一个div的复选框，它也会影响另一个div及其内容。所以我想要一个基于类的方法来获得这个功能。同样在页面加载时，应禁用div内容。感谢

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

Answer 1

Refr此代码正常运行。

 <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>

使用类方法禁用带复选框的div

1 个答案: