Выберите элементы, как ожидалось, но только один раз, почему?

Question

Выберите элементы, как ожидалось, но только один раз, почему?

0

У меня есть таблица, которая представляет все сообщения CMS. Я пишу функцию, которая позволяет выбрать/удалить все сообщения, нажав кнопку "Проверить все/Снимите checkbox element

Например, это будет работать как ожидалось - независимо от того, сколько раз вы нажимаете на него. Если флажки отмечены флажком - он будет предупреждать, что "Проверить все сейчас проверено". В противном случае - он будет предупреждать "Check All is Unchecked now"

$("table thead input").click(function(){

 var checkboxes = $("table tbody tr input")

 if ($(this).is(':checked')) {

   alert('Check All is checked now');
 } else {

    alert('Check All is UNchecked now');
  }
 });

Опять же - работает так, как ожидалось.

Однако, если вы замените alert() другой логикой, это больше не работает так, как ожидалось, но только один раз.

$("table thead input").click(function(){

 var checkboxes = $("table tbody tr input")

  if ($(this).is(':checked')) {

  checkboxes.each(function(){   
    $(this).attr('checked', true);
  });

  } else {

    checkboxes.each(function(){

     $(this).attr('checked', false);
    });
  }
});

Он будет проверять/деактивировать эти checboxes, но только один раз - если вы нажмете на $("table thead input") больше, что один раз, это не сработает.

Я попытался removeAttr('checked') вместо $(this).attr('checked', false), но не повезло.

В чем проблема?

Yang 04 окт. 2013, в 08:58

Источник

Теги:

javascript

jquery

1 ответ

Ещё вопросы

Arun P Johny · Accepted Answer · 2013-10-04T05-11-00.000Z

используйте .prop() вместо .attr(), чтобы установить проверенное состояние

$(this).prop('checked', false);//to uncheck
$(this).prop('checked', true);//to check

Атрибуты vs Свойства

Ваш код можно упростить до

$("table thead input").change(function () {
    var checkboxes = $("table tbody tr input");
    checkboxes.prop('checked', this.checked)
});

Или ниже, если элементы не являются динамическими

//cache the checkbox reference
var checkboxes = $("table tbody tr input");
$("table thead input").change(function () {
    checkboxes.prop('checked', this.checked)
});