Площадь выбранной фигуры

Выбор формы осуществляется с помощью переключателя (или радиокнопки). Элемент переключатель отображается в виде круглой кнопки, существует только в составе группы подобных элементов. Может быть осуществлен выбор лишь одного элемента группы. Все элементы группы должны иметь одинаковое значение параметра NAME. Обязательный параметр value должен иметь уникальное значение для каждого элемента группы.

Так как объект forms имеет свойство-массив elements, в котором содержаться ссылки на элементы формы в порядке их перечисления в теге <form>. Получить доступ к первому элементу формы можно с помощью конструкции: document.form1.elements[0]. Это элемент-переключатель, определен в составе группы элементов. В рассматриваемом примере группа элементов состоит из двух переключателей. Свойство checked выдает значение true, если переключатель выбран, и false в противном случае. Второй элемент рассматриваемой формы можно получить, если воспользоваться конструкцией: document.form1.elements[1]. К другим элементам формы в сценарии обращение производится по именам, хотя и в этом случае можно было бы воспользоваться свойством elements.

HTML-код документа представлен в листинге 5.1.

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

<html>
<head>
<title>Площадь фигуры, выбранной с помощью переключателя</title>
<script>
function test (obj)
{ var a= obj.num.value
var s
if (a=="")
{alert ("Вы не указали размер")}
else
{a=Number (a)
if (obj.elements[0].checked)
{s=a*a*3.14; obj.res.value=s }
else
if (obj.elements[1].checked)
{s=a*a; obj.res.value=s }
else
alert ("Вы не выбрали форму")
}
}
</script>
</head>
<body>
<h4> Выберите форму витража</h4>
<form name="form1">
<input type ="radio" name="fv" value=1>круг<br>
<input type ="radio" name="fv" value=2>квадрат<br>
<h4> Выберите размер (радиус круга или сторону квадрата)</h4>
<input type ="text" name="num" size=10><br>
<input type ="button" value="Площадь" onClick="test(form1)"><br>
<input type ="text" name="res" size=10><br>
<input type ="reset" value=Отменить>
</form></body></html>

Флажки

Элемент управления флажок используется в случае, когда из предложенных вариантов можно выбрать как один вариант, так и несколько. Каждый вариант выбора задается флажком, который можно либо установить, либо сбросить. Флажок определяется в теге <INPUT> значением checkbox параметра type. Обязательным параметром является параметр value, значение которого будет передано на обработку в случае выбора кнопки.


Понравилась статья? Добавь ее в закладку (CTRL+D) и не забудь поделиться с друзьями:  



double arrow
Сейчас читают про: