Флажки формы / радио необходимо изменить класс

Я делаю форму, в которой у пользователя есть список опций. Некоторые переключатели, некоторые флажки. Пользователь, вероятно, слабак и передумает. Мне нужно изменить отмеченное значение во входных данных, а также класс, чтобы я мог настроить таргетинг на эти значения с помощью отправки формы. Это должно происходить, пока пользователь не нажмет «Отправить». Вот то, что у меня есть до сих пор, что меняет атрибут и класс "checked", но как только кнопка больше не выбрана, они не меняются обратно. Помощь!

$("input:checkbox, input:radio").change(function() {
if ($("input:checked")) {
    $(this).attr("checked",true);
    $(this).addClass("checked");
} else {
    $(this).attr("checked",false);
    $(this).removeClass("checked");
}
});

ОБНОВЛЕНИЕ: по-прежнему ничего. Я сократил его до того, что ниже, и он по-прежнему не удаляет класс при изменении.

    $("input:checkbox, input:radio").change(function ()
   {
       if (this.checked)
      {
         $(this).addClass("checked");
      }
      else
       {
         $(this).removeClass("checked");
       }
   });

checkbox jquery radio-button attributes
person user787885    schedule 20.06.2011    source источник

Ответы (3)


arrow_upward
0
arrow_downward

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

if ($(this).is(":checked")) {
    $(this).attr("checked",true);
    $(this).addClass("checked");
} else {
    $(this).removeAttr("checked");
    $(this).removeClass("checked");
}
person Alex    schedule 20.06.2011

arrow_upward
0
arrow_downward

Вы пробовали использовать if($(this).attr('checked')) вместо if ($("input:checked"))? attr - это метод получения или установки в зависимости от используемых вами параметров.

person ecruz    schedule 20.06.2011

arrow_upward
0
arrow_downward

Используйте prop():

$(this).prop("checked",true);

А также:

$(this).prop("checked",false);

См. Этот вопрос: .prop () vs .attr () для справок, почему

Также измените свой код в целом, потому что в вашей версии первая часть утверждения всегда будет истинной, если на вашей странице установлен флажок любой:

$("input:checkbox, input:radio").change(function ()
{
    if (this.checked)
    {
        $(this).prop("checked", true);
        //also since it is a change event you probably 
        //don't need these prop() lines
        $(this).addClass("checked");
    }
    else
    {
        $(this).prop("checked", false);
        $(this).removeClass("checked");
    }
});

ОБНОВЛЕНИЕ:

С вашим обновлением у меня, похоже, работает: http://jsfiddle.net/maniator/r7Yf6/

person Naftali aka Neal    schedule 20.06.2011
comment
Ура, @Neal, он пытался отредактировать ваш ответ, поэтому я отклонил его и вместо этого разместил комментарий. (afaik редактирование сообщения не отправляет никаких уведомлений, верно?) - person Shadow Wizard Wearing Mask V2; 22.06.2011
comment
@shadow, не верьте (подождите, OP пытался отредактировать мой ответ, почему?) - person Naftali aka Neal; 22.06.2011
comment
@Shadow - что OP добавил к моему ответу? - person Naftali aka Neal; 22.06.2011
comment
@ Нил точно то же самое, что он добавил к своему собственному вопросу, иначе я бы добавил то, что он сказал, к своему собственному комментарию. - person Shadow Wizard Wearing Mask V2; 22.06.2011