1

私は現在、親チェックボックスがチェックされていない場合はチェックボックスリストを無効にし、チェックされている場合は有効にするjQuery関数を持っています。ただし、親チェックボックスはデフォルトでオフになっています。これが必要です。

これは、ページロード時に有効になり、親のチェックボックスをオンまたはオフにした場合にのみ無効になるため、コードに問題が発生します。

誰でも修正を知っていますか？

$(document).ready(function() {
    $('#cbsys').bind('click', function() {
        var doEnable = ($('#cbsys:checked').length > 0);
        $('#syscbl').each(function() {
            if (doEnable) {
                $(this).attr('disabled', null);
                $(this).parents('label').removeClass('cssDisabled');
            } else {
                $(this).attr('disabled', 'disabled');
                $(this).parents('label').addClass('cssDisabled');
            }
        });
    });
});
4

2 に答える 2

4

関数としてキャッシュし、ドキュメントの準備ができているときとクリック時に実行するだけです。また、コードを少し最適化しました。

function disableCk() {
  var doEnable = $('#cbsys:checked').length; // <-- use a class
  $('#syscbl').each(function() { // <-- use a class
    var $this = $(this);
    if (doEnable) {
      $this.prop('disabled', false)
        .parents('label')
        .removeClass('cssDisabled');
    }
    else {
      $this.prop('disabled', true)
        .parents('label')
        .addClass('cssDisabled');
    }
  });
}

$(document).ready(function() {
  disableCk();
  $('#cbsys').on('click', disableCk);
});

編集

無効な HTML である同じ名前の複数の ID を使用しているように見えることに気付きました。代わりにクラスを使用してください。コードにコメントを入れたので、上を見てください。

于 2012-08-07T21:24:59.183 に答える
1

バインドした直後にクリック ハンドラーをトリガーするだけです。

$('#cbsys').bind('click', function() {
    var doEnable = ($('#cbsys:checked').length > 0);
    $('#syscbl').each(function() {
    if (doEnable) {
        $(this).attr('disabled', null);
        $(this).parents('label').removeClass('cssDisabled');
    }
    else {
        $(this).attr('disabled', 'disabled');
        $(this).parents('label').addClass('cssDisabled');
    }
}).trigger('click').trigger('click');
于 2012-08-07T21:22:43.997 に答える