Продемонстрирую алгоритм работы с полем radio для универсального случая, когда мы не знаем существует ли поле, одно у него значение в форме или оно может принимать значение из некоторого набора (случай списка из радио-кнопок).
На практике, часто задача стоит так, что нам нужно определить выбран ли какой то элемент radio-списка в форме, и если выбран, то получить его значение (то что задано в атрибуте value).
Если элемент не существует или же переключатель не выбран — будем возвращать false. В других случаях вернем значение элемента.
Пусть существует такая форма:
|
|
<form id="myForm"> <input type="radio" name="chosen" value="1" /> ... <input type="radio" name="chosen" value="N" /> </form> |
Мы не знаем сколько радио-элементов с именем chosen в списке. Их может не быть вообще.
Для начала нужно получить доступ к форме, содержащей radio элемент. Можно обратиться к общему списку форм документа:
|
|
//например, первая форма документа var frm = document.forms[0]; |
но более надежный способ, найти форму по ID:
|
|
var frm = document.getElementById(<span class="highVAL">"myForm"</span>); |
Теперь нужно понять, что представляет из себя chosen — одно поле или список. И, наконец, проверить его состояние checked — выбран ли он.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 |
var frm = document.getElementById("myForm"); var found = false; //флаг, нашли ли мы нужный элемент var value = ''; //значение элемента //проверяем существует ли массив chosen в форме if (frm.elements.chosen[0] == undefined) { //существует ли одиночный элемент? if (frm.elements.chosen == undefined) { ; //chosen отсутствует в форме } else //случай одного радио-элемента if (frm.elements.chosen.checked) { found = true; value = frm .elements.chosen.value; } } else { //случай списка //перебираем элементы списка - ищем отмеченный for(var k = 0; k < frm.elements.chosen.length; k++) { if (frm.elements.chosen[k].checked) { found = true; value = frm.elements.chosen[k].value; break; } } } //выводим сообщение о результатах работы if (found) alert('Chosen is found! Value is - ' + value); else alert('Chosen is not found or is not checked!'); |
frm.elements.chosen, в зависимости от числа элементов, может быть то HTMLInputElement, то RadioNodeList или вообще отсутствовать, а frm.elements.chosen[0] может отсутствовать (быть undefined) или быть HTMLInputElement. На этом и строится логика проверки.
Написать комментарий
Данная запись опубликована в 08.01.2016 23:24 и размещена в рубрике javaScript.
Вы можете перейти в конец страницы и оставить ваш комментарий.
Мало букафф? Читайте есчо !
Май 13, 2022 г.
С тех пор как стало возможным указать загружаемому в HTML документе скрипту флаги-аттрибуты async и defer, стало необходимо понимать то, в какой очередности скрипты будут исполнены, если они зависят друг от друга.
Так если ваш скрипт зависит от ...
Читать
Декабрь 17, 2018 г.
При работе с HTML документом из JavaScript одной из типовых операций является установка значения того или иного атрибута выбранного контейнера (тега).
Vanila JS
В чистом js (vanila) значение атрибута можно установить следующим образом:
[crayon-67ec8bf6bf6cf931851297/] ...
Читать