Установите выбранное радио из группы радио со значением

153

Почему я борюсь с этим?

У меня есть значение: 5

Как проверить переключатель «mygroup» группы со значением 5?

$("input[name=mygroup]").val(5); // doesn't work?
dcolumbus
источник

Ответы:

351

С помощью селектора атрибутов вы можете выбрать элемент ввода с соответствующим значением. Затем вы должны установить атрибут явно, используя .attr:

var value = 5;
$("input[name=mygroup][value=" + value + "]").attr('checked', 'checked');

Начиная с jQuery 1.6, вы также можете использовать .propметод с логическим значением (это должен быть предпочтительный метод):

$("input[name=mygroup][value=" + value + "]").prop('checked', true);

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

Код для удаления отмеченного атрибута из всех переключателей одной группы переключателей -

$('[name="radioSelectionName"]').removeAttr('checked');
Феликс Клинг
источник
.prop ('check', true), вероятно, лучше или .is ()
bladefist
3
@bladefist: .isздесь не поможет, но я согласен с .prop. Тогда это было недоступно;) Буду обновлять мой ответ. Спасибо!
Феликс Клинг
4
Если значение переключателя имеет десятичную дробь, вам нужно поместить значение в кавычки
Роберт
1
@ Роберт: Да, наверное. Из документации : «Может быть либо одним словом без кавычек, либо строкой в ​​кавычках».
Феликс Клинг
5
Смотрите ответ Джонатана. Документы jQuery показывают, что .val()поддерживает настройку значений для радио или групп флажков. Технически этот ответ работает, но он обходной и гораздо менее читаемый / запоминающийся.
Jinglesthula
144

Есть лучший способ проверить радио и флажок; вы должны передать массив значений в метод val вместо необработанного значения

Примечание: если вы просто передадите значение само по себе (не находясь внутри массива ), это приведет к тому, что все значения «mygroup» будут установлены в значение.

$("input[name=mygroup]").val([5]);

Вот документ JQuery, который объясняет, как это работает: http://api.jquery.com/val/#val-value

А .val([...])также работает с элементами форм , как <input type="checkbox">, <input type="radio">и <option>S внутри <select>.

Входные данные и параметры, имеющие значение, совпадающее с одним из элементов массива, будут проверены или выбраны, в то время как входные значения и параметры, которые не соответствуют ни одному из элементов массива, не будут выбраны или не выбраны.

Скрипка, демонстрирующая эту работу: https://jsfiddle.net/92nekvp3/

Джонатан Паскье
источник
Принят ответ (ну, должен быть). Начиная с jQuery 1.0, смотрите последний пример из документации (прокрутите вниз): api.jquery.com/val Скопировано здесь: jsfiddle.net/JoePC/w1f9ykso
JoePC
Это хороший и последовательный способ установить все входные значения. Жаль, что мне потребовалось 6 лет, чтобы узнать об этом.
Джефф Лоури
1
Потратил некоторое время, пытаясь выяснить, почему все мои значения в группе были установлены на переданное значение вместо проверки значения. Оказывается, я передал значение отдельно, а не внутри массива.
КИСЛОРОД
14

Попробуй это:

$('input:radio[name="mygroup"][value="5"]').attr('checked',true);

JS Fiddle demo .

Дэвид говорит восстановить Монику
источник
1
@ Охотник, спасибо ... сегодня явно не мой день для jQuery ... = /
Дэвид говорит восстановить Монику
8
$("input[name='mygroup'][value='5']").attr("checked", true);
охотник
источник
7

При изменении значения атрибута, как указано выше, changeсобытие не запускается, поэтому при необходимости по каким-либо причинам вы можете вызвать его так

$('input[name=video_radio][value="' + r.data.video_radio + '"]')
       .prop('checked', true)
       .trigger('change');
Жан-Марк Амон
источник
1

Или вы можете просто написать атрибут value:

$(':radio[value=<yourvalue>]').attr('checked',true);

Это работает для меня.

Ketan
источник
0
var key = "Name_radio";
var val = "value_radio";
var rdo = $('*[name="' + key + '"]');
if (rdo.attr('type') == "radio") {
 $.each(rdo, function (keyT, valT){
   if ((valT.value == $.trim(val)) && ($.trim(val) != '') && ($.trim(val) != null))

   {
     $('*[name="' + key + '"][value="' + (val) + '"]').prop('checked', true);
   }
  })
}
Амин Фатхи
источник
4
Не могли бы вы объяснить, что ваш код делает в вашем ответе? По крайней мере, предложение или около того. И как это решает решение. Спасибо.
Алекс
0

Чистая версия JavaScript:

document.querySelector('input[name="myradio"][value="5"]').checked = true;
JukkaV
источник
-1
$('input[name="mygroup"]').val([5])
Anjitha
источник
1
Можете ли вы объяснить, чем ваше решение отличается от других уже предоставленных решений?
Джовани Веркаутерен
@ Giovani Vercauteren, мы должны дать имя в виде строки. Поэтому я даю mygroup в виде строки в коде.
Анжита