如何使用 jquery 禁用复选框？

Question

我用它搜索了更多时间，但它不起作用，我想禁用复选框，用户不检查并且可以在某些情况下检查它。好的，现在，我尝试禁用它们。我用的是jquery 2.1.3

 <input type="checkbox" class="checkbox1" id="chk" name="check[]" value="U01" />Banana
 <input type="checkbox" class="checkbox1" id="chk" name="check[]" value="U02" />Orange
 <input type="checkbox" class="checkbox1" id="chk" name="check[]" value="U03" />Apple
 <input type="checkbox" class="checkbox1" id="chk" name="check[]" value="U04" />Candy

$(window).load(function () {
    $('#chk').prop('disabled', true);
});

Answer 1

id 应该是唯一的。您不能有四个具有相同 ID 的复选框。

您可以尝试其他 select 或 select 整个复选框范围，例如 .checkbox1（通过 class）、input[type="checkbox"]（通过 tag/attribute).修复 ID 后，您甚至可以尝试 #chk1, #chk2, #chk3, #chk4。

下面的代码片段使用 class 名称 'chk' 而不是 ID 'chk'。此外，它使用 attr 来设置属性，尽管它也使用 prop 对我有用。

$(window).load(function() {
  $('.chk').attr('disabled', true);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" class="chk" name="check[]" value="U01" />Banana
<input type="checkbox" class="chk" name="check[]" value="U02" />Orange
<input type="checkbox" class="chk" name="check[]" value="U03" />Apple
<input type="checkbox" class="chk" name="check[]" value="U04" />Candy

Answer 2

您已经更改了 ID，但您也可以将 class 放在相同的属性中，例如：

<input type="checkbox" class="checkbox1 chk" name="check[]" value="U01" />Banana

然后您可以使用 jQuery 根据您的需要禁用或选中复选框

要禁用：

$(function () {
    $('.chk').prop('disabled', true);
});

至"precheck"：

$(function () {
    $('.chk').prop('checked', true);
});

您可以更改选择器以适应 ID 或 classes 甚至元素，并根据您的需要在 true 或 false 之间更改属性。

Answer 3

HTML:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" class="checkbox1" class="chk" name="check[]" value="U01" />Banana
<input type="checkbox" class="checkbox1" class="chk" name="check[]" value="U02" />Orange
<input type="checkbox" class="checkbox1" class="chk" name="check[]" value="U03" />Apple
<input type="checkbox" class="checkbox1" class="chk" name="check[]" value="U04" />Candy

Javascript/jQuery

$(function() {
   $("input.checkbox1").prop("disabled", true);
});

如何使用 jquery 禁用复选框？

How to disable checkbox with jquery?

javascript

checkbox

jquery