Листинг 4.1. Вычисление площади выбранной с помощью переключателя фигуры

<HTML>

<HEAD>

<TITLE>Данные из формы типа "переключатель". Событие Click</TITLE>

<script language="JavaScript">

<!—-//

function test (k)

{ var a= form1.data.value

if (a !="" )

form1.res.value= k*Math.pow(a,2)

else alert ("Введите значение")

}

//-—>

</script>

</HEAD>

<BODY>

<FORM name="form1">

Введите значение

<input type="text" name="data" size=10>

<hr>

Укажите форму <br>

<input type="radio" name="fv" value=l

onClick="test(forml.elements[1].value)">квадрат<br>

<input type="radio" name="fv" value=3.14

onClick="test(forml.elements[2].value)">круг<br>

<input type="radio" name="fv" value=0.42

onClick="test(forml.elements[3].value)">треугольник<hr>

<input type="reset" value="0тменить"><hr>

Площадь: <input type="text" name="res" size=10>

</FORM>

</BODY>

</HTML>

Перепишем функцию test, осуществляющую доступ к элементам формы через свойство-массив elements.

function test (k)

{ var a= document.forms[0].elements[0].value

if (a !="" )

document.forms[0].elements[5].value= k*Math.pow(a,2)

else alert ("Введите значение")

}

В следующем примере проверяется правильность обработки данных элемента управления "переключатель". Объект radio имеет свойства name, type, value. Событие FOCUS возникает, когда элемент формы получает фокус. При получении фокуса переключателем в поле для многострочного текста отображаются значения свойства для выбранного переключателя.

Свойства переключателя

Необходимо написать сценарий, в котором для каждого переключателя выводятся значения соответствующих ему свойств, как на рис. 4.1.

Группа элементов состоит из четырех переключателей, пятый элемент формы — поле ввода многострочного текста. При выполнении сценария формируется строка s, содержащая требуемые значения. Фактическим параметром функции обработки события test является элемент формы — переключатель, а не значение параметра value выбранного переключателя, как в предыдущем примере. Далее в сценарии для получения свойств переключателя ИСПОЛЬЗУЮТСЯ конструкции obj. value, obj.name, obj.type. В этом примере в качестве значения параметра value в переключателе применяется строковый литерал.

HTML-код приведен в листинге 4.2.