jQuery - onay kutusunu etkinleştir / devre dışı bırak

Bunun gibi bir sürü onay kutum var. "Beni Kontrol Et" onay kutusu işaretliyse, diğer tüm 3 onay kutusunun etkinleştirilmesi gerekir, aksi takdirde devre dışı bırakılmalıdır. Bunu jQuery kullanarak nasıl yapabilirim?

<form name="frmChkForm" id="frmChkForm">
<input type="checkbox" name="chkcc9">Check Me
<input type="checkbox" name="chk9[120]">
<input type="checkbox" name="chk9[140]">
<input type="checkbox" name="chk9[150]">
</form>

İşaretlemenizi biraz değiştirin:

$(function() {
  enable_cb();
  $("#group1").click(enable_cb);
});

function enable_cb() {
  if (this.checked) {
    $("input.group1").removeAttr("disabled");
  } else {
    $("input.group1").attr("disabled", true);
  }
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form name="frmChkForm" id="frmChkForm">
  <input type="checkbox" name="chkcc9" id="group1">Check Me <br>
  <input type="checkbox" name="chk9[120]" class="group1"><br>
  <input type="checkbox" name="chk9[140]" class="group1"><br>
  <input type="checkbox" name="chk9[150]" class="group1"><br>
</form>

Kimlik ve sınıfları tanıtmadan öznitelik seçicileri kullanarak bunu yapabilirsiniz, ancak daha yavaş ve (imho) okunması daha zordur.

Bu en güncel çözümdür.

<form name="frmChkForm" id="frmChkForm">
    <input type="checkbox" name="chkcc9" id="group1" />Check Me
    <input type="checkbox" name="chk9[120]" class="group1" />
    <input type="checkbox" name="chk9[140]" class="group1" />
    <input type="checkbox" name="chk9[150]" class="group1" />
</form>

$(function() {
    enable_cb();
    $("#group1").click(enable_cb);
});

function enable_cb() {
    $("input.group1").prop("disabled", !this.checked);
}

İşte için kullanım detay .attr()ve .prop().

jQuery 1.6+

Yeni .prop()işlevi kullanın :

$("input.group1").prop("disabled", true);
$("input.group1").prop("disabled", false);

jQuery 1.5 ve altı

.prop()Kullanmak gerek böylece işlevi kullanılamaz .attr().

Onay kutusunu devre dışı bırakmak için (devre dışı bırakılan özniteliğin değerini ayarlayarak)

$("input.group1").attr('disabled','disabled');

ve etkinleştirmek için (niteliği tamamen kaldırarak)

$("input.group1").removeAttr('disabled');

Herhangi bir jQuery sürümü

Sadece bir elemanla çalışıyorsanız, her zaman kullanımı en hızlı olacaktır DOMElement.disabled = true. .prop()Ve .attr()işlevlerini kullanmanın yararı, eşleşen tüm öğeler üzerinde çalışacaklarıdır.

// Assuming an event handler on a checkbox
if (this.disabled)

ref: jQuery ile bir onay kutusu için "işaretli" ayarı yapılıyor mu?

<form name="frmChkForm" id="frmChkForm">
<input type="checkbox" name="chkcc9" id="chkAll">Check Me
<input type="checkbox" name="chk9[120]" class="chkGroup">
<input type="checkbox" name="chk9[140]" class="chkGroup">
<input type="checkbox" name="chk9[150]" class="chkGroup">
</form>

$("#chkAll").click(function() {
   $(".chkGroup").attr("checked", this.checked);
});

Tek tek onay kutularının işaretli olması durumunda tüm onay kutularının işaretlenmesini / işaretinin kaldırılmasını sağlamak için ek işlevsellik ile:

$(".chkGroup").click(function() {
  $("#chkAll")[0].checked = $(".chkGroup:checked").length == $(".chkGroup").length;
});

İşte JQuery 1.10.2 kullanan başka bir örnek

$(".chkcc9").on('click', function() {
            $(this)
            .parents('table')
            .find('.group1') 
            .prop('checked', $(this).is(':checked')); 
});