jQuery проверяет все, что не работает с флажками

#javascript #jquery

#javascript #jquery

Вопрос:

Я пишу некоторый код, который позволит следующее:

1.) Если пользователь установит флажок, он изменит родительский <tr> элемент на выбранный класс (это также можно снять и удалить класс)

2.) Все флажки, которые уже установлены, будут иметь класс, добавленный при загрузке документа

3.) Если пользователь проверяет ввод #checkall, то все входные данные будут проверены и добавят класс selected (если снова проверить, то он отменит выбор всех и удалит класс)

Это код, который у меня есть до сих пор:

 $("table input[name=choose]:checked").each(function()
    {
        $(this).closest("tr").addClass("selected");
    });

    $("table input[name=choose]").live("change", function()
    {
        $(this).closest("tr").toggleClass("selected");
    });

    if ($('#checkall:checked') ==  true)
    {
        $('#checkall').live("click", function()
        {
            $('table input[name=choose]').attr('checked', false);
            $('table input[name=choose]').closest("tr").toggleClass("selected");              
        });
    }
    else
    {
        $('#checkall').live("click", function()
        {
            $('table input[name=choose]').attr('checked', true);
            $('table input[name=choose]').closest("tr").toggleClass("selected");
        });
    }
  

Первые два работают нормально, но номер 3 не снимает флажки… Есть идеи, почему? Но часть класса работает нормально??

Спасибо

Ответ №1:

Я предполагаю, что он всегда запускается в блоке else (вы отладили это)?

Попробуйте написать это для проверки, установлен ли флажок:

 if ($('#checkall').attr('checked'))
  

Комментарии:

1. Я не думаю, что это доходит до оператора else, потому что эта проверка происходит при загрузке страницы, а не после проверки??

2. Вы должны выполнить этот код в обработчике щелчка вашего #checkall флажка!

Ответ №2:

Потому if ($('#checkall:checked') == true) что всегда false ..

либо используйте

 if ($('#checkall').is(':checked'))
  

или

 if ( $('#checkall:checked').length )
  

Обновление после комментария

Замените всю третью часть (все if / else) на

 $('#checkall').live("change", function()
        {
            $('table input[name=choose]')
                 .attr('checked', this.checked)
                 .closest("tr")
                 .toggleClass("selected", this.checked);              
        });
  

демонстрация на http://jsfiddle.net/gaby/KqwsZ/1 /

Комментарии:

1. @Cameron, действительно, не снова .. Вам нужно это для переключения на основе текущего значения ответа #checkall .. updating..

2. @Cameron, тебе, вероятно, тоже не нужно live .. это используется, если вы динамически заменяете фактический #checkall флажок другим .. Просто используйте .change(function(){..}) напрямую.