Значение изменения JQuery с помощью переключателя

У меня есть переменная с именем category, которая должна изменить ее значение в соответствии с выбранным переключателем. Проблема в том, что я не получаю этого при щелчке переключателя или другого, значение мгновенно изменится.

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

<form>
<input type="radio" name="category" value="doctor" /> Doctor
<input type="radio" name="category" value="police" checked /> Policia
</form>

var category = $('[name="category"]:checked').val();

Мне нужно, чтобы вы автоматически меняли значение переменной category при нажатии переключателей.

Ответ 1

Вам нужно изменить значение категории каждый раз, когда пользователь меняет выбранный переключатель. Поэтому вам понадобится событие для запуска, когда пользователь нажимает на радио. Вы можете проверить FIDDLE

var category = null;
$("input[name='category']").click(function() {
    category = this.value;
});

Ответ 2

Прикрепите обработчик события к событию change:

$(':radio[name="category"]').change(function() {
  var category = $(this).filter(':checked').val();
});

Ответ 3

Я думаю, вам нужно просто что-то вроде этого:

var category;

    $('radio[name="category"]').click(function(){
      category=this.value;
    });

Ответ 4

Вместо использования переменной category используйте $('[name="category"]:checked').val(), где бы вы ни выбрали значение переключаемого переключателя. В противном случае вы можете использовать событие change или click для установки значения переключателей checked в category.

Ответ 5

var category;
    $(':radio[name="category"]').change(function() {
      category=this.value;
    });

И это jsfiddle.net демо.

Ответ 6

Вы не должны указывать один и тот же идентификатор более чем на один элемент, вы должны использовать класс следующим образом:

<form>
  Option 1<input type="radio" name="opt" class="radio" value="Option 1">
  Option 2<input type="radio" name="opt" class="radio" value="Option 2">
</form>

вместо:

<form>
  Option 1<input type="radio" name="opt" id="radio" value="Option 1">
  Option 2<input type="radio" name="opt" id="radio" value="Option 2">
</form>

и ваш код все тот же, и он должен работать нормально:)

Ответ 7

используйте . change(), чтобы зафиксировать событие изменения для переключателя.