JavaScript. Подробное руководство, 6-е издание

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

  // Все радиокнопки в форме с атрибутом id=”shipping"
  document.querySelectorAll('«shipping input[type="radio"]');
  // Все радиокнопки с атрибутом name="method" в форме с атрибутом id="shipping"
  document.querySelectorAll('«shipping input[type="radio"][name="method"]');

Однако, как описывалось в разделах 14.7,15.2.2 и 15.2.3, элемент <form> с установленным атрибутом name или id можно также выбрать другими способами. Элемент <form> с атрибутом name="address" можно выбрать любым из следующих способов:

  window.address // Ненадежный: старайтесь не использовать
  document.address // Может применяться только к формам с атрибутом name
  document.forms.address // Явное обращение к форме с атрибутом name или id
  document.forms[n] // Ненадежный: n - порядковый номер формы

В разделе 15.2.3 говорилось, что свойство document.forms ссылается на объект HTMLCollection, позволяющий выбирать элементы <form> по их порядковым номерам, по значению атрибута id или name. Объекты Form сами по себе действуют подобно объектам HTMLCollection, хранящим элементы форм, и могут индексироваться именами или числами. Если первый элемент формы с атрибутом name="address" имеет атрибут name="street”, на него можно сослаться с помощью любого из следующих выражений:

  document.forms.address[0]
  document.forms.address.street
  document.address.street // только для name="address", но не id=”address”

Если необходимо явно указать, что выполняется обращение к элементу формы, вместо объекта формы можно индексировать его свойство elements:

  document.forms.address.elements[0]
  document.forms.address.elements.street

Для выбора конкретных элементов документа предпочтительнее использовать атрибут id. Однако при отправке форм атрибут name играет особую роль и чаще используется с самими формами, чем с элементами форм. Обычно при работе с группами флажков и обязательно при работе с группами радиокнопок для атрибута name используется одно и то же значение. Напомню, что, когда объект HTMLCollection индексируется именем и существует сразу несколько элементов, использующих одно и то же имя, возвращаемым значением является объект, подобный массиву, содержащий все элементы с указанным именем. Взгляните на следующую форму, содержащую радиокнопки для выбора метода доставки товара:

  <form name="shipping">
   <fieldset>
   <legend>Shipping Method</legend>
   <label>
   <input type="radio" name="method" value="1st">
первым классом
   </1аbеl>
   <label>
   <input type=”radio" name="method" value="2day">
   3a 2 дня самолетом
   </label>
   <label>
   <input type="radio" name="method" value=”overnite">
   В течение ночи
   </label>
   </fieldset>
  </form>

Сослаться на массив радиокнопок в этой форме можно следующим образом:

  var methods = document.forms.shipping.elements.method;

Обратите внимание, что элементы <form> имеют HTML-атрибут и соответствующее ему свойство с именем «method», поэтому в данном случае необходимо использовать свойство elements формы вместо прямого обращения к свойству method. Чтобы определить, какой метод доставки выбрал пользователь, необходимо обойти элементы формы в массиве и проверить свойство checked каждого из них:

  var shippingjnethod;
  for(var і = 0; і < methods.length; і++)
   if (methods[і].checked) shipping_method = methods[i].value;

Со свойствами элементов форм, такими как checked и value, мы поближе познакомимся в следующем разделе.

15.9.2. Свойства форм и их элементов

Наиболее интересным для нас свойством объекта Form является массив elements[], описанный выше. Остальные свойства объекта Form менее важны. Свойства action, encoding, method и target непосредственно соответствуют атрибутам action, encoding, method и target элемента <form>. Все эти свойства и атрибуты используются для управления отправкой данных формы на веб-сервер и отображением результатов. Клиентский сценарий на языке JavaScript может устанавливать значения этих свойств, но это имеет смысл, только когда форма действительно отправляется серверной программе.

До появления JavaScript отправка форм выполнялась с помощью специальной кнопки Submit, а сброс значений элементов формы в значения по умолчанию - с помощью специальной кнопки Reset. В языке JavaScript тем же целям служат два метода, submit и reset, объекта Form. Метод submit объекта Form отправляет форму, а метод reset сбрасывает элементы формы в исходное состояние.