Отметьте и снимите флажок "Динамически" с помощью jQuery: ошибка?

Я сделал script, чтобы контролировать контрольные и подчиненные флажки (автоматическая проверка и снятие отметки).

Вот мой JS:

$(document).ready(function() {

    $('#myCheck').click(function() {
        $('.myCheck').attr('checked', false);
    });
    $('.myCheck').click(function() {
        if ($('.myCheck').is(':checked')) {
            $('#myCheck').attr('checked', false);
        } else {
            $('#myCheck').attr('checked', true); // IT DOESN'T WORK, WHY ?
            alert("Checkbox Master must be checked, but it not!");
        }
    });

});

И вот мой HTML:

<input type="checkbox" id="myCheck" checked="checked" />&nbsp;&nbsp;Checkbox Master<br />
<input type="checkbox" class="myCheck" value="1" />&nbsp;&nbsp;Checkbox Slave 1<br />
<input type="checkbox" class="myCheck" value="1" />&nbsp;&nbsp;Checkbox Slave 2

Посмотрите на мой простой JsFiddle, чтобы понять проблему.

РЕДАКТИРОВАТЬ 1: Как сказал Inser, проблема возникает с jQuery 1.9.2 и более. Нет проблем с jQuery 1.8.3. Странно...

РЕДАКТИРОВАТЬ 2: Inser нашел решение, используйте .prop('checked', true) вместо .attr('checked', true). Посмотрите на комментарии ниже...

Ответы

Ответ 1

Использовать метод prop для новых версий jQuery:

$('#myCheck').prop('checked', true);
$('#myCheck').prop('checked', false);

http://jsfiddle.net/uQfMs/37/

Ответ 2

Вы можете попробовать это.

$('#myCheck').click(function() {
    var checkBoxes = $(this).siblings('input[type=checkbox]');
    checkBoxes.prop('checked', $(this).is(':checked') ? true : false);
});

Ответ 3

Возможно, вы просто хотите проверить мастерский флажок:

$('#myCheck').click(function() {
       $('.myCheck').attr('checked', false);
       $(this).attr('checked', true);
});

см. это fiddle.

Ответ 4

я сделал некоторые впечатления, на самом деле $(':checkbox').attr('checked',false); Хотя это может установить атрибут "checked", но он не будет продолжать отображаться в визуальном режиме. и $(':checkbox').prop('checked', true); это прекрасно работает! надеюсь, что это может помочь.

Ответ 5

Я написал вам плагин для этого:

$.fn.dependantCheckbox = function() {
  var $targ = $(this);
  function syncSelection(group, action) {
    $targ.each(function() {
      if ($(this).data('checkbox-group') === group) {
        $(this).prop('checked', action);
      }
    });
  };
  $('input[type="checkbox"][data-checkbox-group]').on('change', function() {
    var groupSelection = $(this).data('checkbox-group');
    var isChecked = $(this).prop('checked');
    syncSelection(groupSelection, isChecked);
  });
}
$('input[type="checkbox"][data-checkbox-group]').dependantCheckbox();


<input data-checkbox-group="1" type="checkbox" id="test" />
<label for="test">test</label>
<input data-checkbox-group="1" type="checkbox" id="test2" />
<label for="test2">test2</label>
<input data-checkbox-group="2" type="checkbox" id="test3" />
<label for="test3">test3</label>
<input data-checkbox-group="2" type="checkbox" id="test4" />
<label for="test4">test4</label>

http://codepen.io/nicholasabrams/pen/mJqyqG