10

Как проверить радио-кнопку с помощью jQuery?

16

Я пытаюсь установить радио-кнопку в состояние "выбрано" с помощью jQuery. Вот мой код:

<form>
    <div id='type'>
        <input type='radio' id='radio_1' name='type' value='1' />
        <input type='radio' id='radio_2' name='type' value='2' />
        <input type='radio' id='radio_3' name='type' value='3' /> 
    </div>
</form>

А вот JavaScript:

jQuery("#radio_1").attr('checked', true);

Это не работает:

jQuery("input[value='1']").attr('checked', true);

Это тоже не работает:

jQuery('input:radio[name="type"]').filter('[value="1"]').attr('checked', true);

И это тоже не сработало.

У вас есть другая идея? Что я упускаю?

5 ответ(ов)

16

Для версий jQuery, равных или выше (>=) 1.6, используйте:

$("#radio_1").prop("checked", true);

Для версий ниже (<) 1.6, используйте:

$("#radio_1").attr('checked', 'checked');

Совет: Возможно, вам также стоит вызвать click() или change() на радио-кнопке после этого. Смотрите комментарии для получения дополнительной информации.

3

Попробуйте это.

В этом примере я обращаюсь к элементу по имени и значению его input:

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

Важно знать: если значение состоит из нескольких слов, код также будет работать благодаря апострофам.

1

Вы можете использовать следующий код для проверки, выбрана ли радиокнопка с ID radio_1:

$("#radio_1").is(":checked")

Этот вызов вернёт true или false, поэтому его можно использовать в условии if. Например:

if ($("#radio_1").is(":checked")) {
    // Действия, если радиокнопка выбрана
} else {
    // Действия, если радиокнопка не выбрана
}
0

В jQuery 1.6 была добавлена функция prop(), которая выполняет ту же задачу, что и функция attr(), но более правильно с точки зрения работы с булевыми атрибутами. Например, чтобы установить радио-кнопку в состояние "выбрано", вы можете использовать следующий код:

$("#radio_1").prop("checked", true);

Этот подход рекомендуется, поскольку prop() напрямую взаимодействует с текущим состоянием DOM, в отличие от attr(), которая может работать с атрибутами в HTML, но не всегда отражает текущее состояние элемента. Использование prop() значительно упрощает и улучшает работу с элементами управления, такими как радиокнопки и чекбоксы.

0

Попробуйте это.

Чтобы установить Radio-кнопку с использованием значения, используйте следующий код:

$('input[name=type][value=2]').attr('checked', true); 

Или

$('input[name=type][value=2]').attr('checked', 'checked');

Или

$('input[name=type][value=2]').prop('checked', 'checked');

Чтобы установить Radio-кнопку с использованием ID, воспользуйтесь этим кодом:

$('#radio_1').attr('checked', 'checked');

Или

$('#radio_1').prop('checked', 'checked');
Чтобы ответить на вопрос, пожалуйста, войдите или зарегистрируйтесь