Переключатели
Различают два вида переключателей - зависимые Radio Buttons и независимые Checkbox. Независимый переключатель, который также называется флажком. Независимые переключатели имеют свойства, приведенные ниже.
Form. Позволяет обратиться к родительской по отношению к переключателю форме, что дает возможность получить доступ к ее свойствам.
Name. Данное свойство возвращает имя, определенное атрибутом NAME тега <INPUT>.
Value. Это свойство возвращает строку, определенную атрибутом VALUE тега <INPUT> и доступно как для чтения, так и для редактирования.
Checked. Данное свойство является ключевым, поскольку задает состояние флажка. Значение свойства имеет тип Boolean. Установленному флажку соответствует True, а сброшенному -False.
В примере (Пример 36) продемонстрирована работа с независимыми переключателями (рис.13). На Web-странице приведены семь флажков и три кнопки. При выборе первой кнопки Установить все переключатели в положение True все переключатели примут значение True. Если пользователь нажмет вторую кнопку Установить все переключатели в положение False, флажки сбросят свои значения. В случае если пользователь установит лишь некоторые из переключателей в положение "включен", нажатие третьей кнопки Показать выбранные переключатели позволит вывести окно сообщения, отображающее все выбранные пользователем.
Пример 36. Работа с независимыми переключателями.
<HTML>
<HEAD>
<SCRIPT LANGUAGE="VBScript">
Sub TestS_OnClick
For x = 0 to 6
Document.TestForm.Elements(x).Checked = True
Next
End Sub
Sub TestC_OnClick
For x = 0 to 6
Document.TestForm.Elements(x).Checked = False
Next
End Sub
Sub TestF_OnClick
NL = chr(13) + chr(10)
Str = "Выбраны переключатели:" + NL
For x=0 to 6
If Document.TestForm.Elements(x).Checked Then
Str = Str + Document.TestForm.Elements(x). _
Value + NL
End If
Next
Alert Str
End Sub
</SCRIPT>
</HEAD>
<BODY>
<FORM NAME="TestForm">
<P ALIGN="center">
<TABLE>
<TD><Option One<TD><INPUT TYPE ="checkbox"
NAME="cbl" VALUE="One"><TR>
<TD><Option Two<TD><INPUT TYPE ="checkbox"
NAME="cb2" VALUE="Two"><TR>
<TD><Option Three<TD><INPUT TYPE="checkbox"
NAME="cb3" VALUE="Three"><TR>
<TD><Option Four<TD><INPUT TYPE ="checkbox"
NAME="cb4" VALUE="Four"><TR>
<TD><Option Five<TD><INPUT TYPE ="checkbox"
NAME="cb5" VALUE="Five"><TR>
<TD><Option Six<TD><INPUT TYPE ="checkbox"
NAME="cb6" VALUE="Six"><TR>
<TD><Option Seven<TD><INPUT TYPE = "checkbox"
NAME="ob7" VALUE="Seven"><TR>
</TABLE>
</P>
<P ALIGN="center">
<INPUT TYPE ="button" NAME="TestS"
VALUE="Установить все переключатели в положение True">
<INPUT TYPE="button" NAME="TestC"
VALUE="Установить все переключатели в положение False">
<INPUT TYPE ="button" NAME="TestF"
VALUE="Показать выбранные переключатели ">
</P>
</FORM>
</ВОDY>
</HTML>
Рис.13. Работа с независимыми переключателями.
Зависимые переключатели имеют те же свойства, что и независимые.
Следует отметить, что при работе с зависимыми переключателями обработчик события OnClick нельзя называть по совокупности имени элемента и названия события. Это связано с тем, что зависимые переключатели одной группы имеют общее имя. Вместо этого обработчик события OnClick должен быть выполнен по аналогии с примером, приведенным в Примере 37.
При выборе переключателя происходит смена фонового цвета. Нажатие кнопки Default приводит к возврату страницы к исходному
виду. Параметр IndexR передается обработчику и позволяет определить, на каком переключателе был выполнен щелчок (рис.14).
Рис.14. Работа с зависимыми переключателями
Пример 37. Работа с зависимыми переключателями
<HTML> <HEAD>
<SCRIPT LANGUAGE="VBScript">
Sub RadioColor(indexR)
if indexR = 0 then Document.BgColor = "Red"
if indexR = 1 then Document.BgColor = "Silver"
if indexR = 2 then Document.BgColor = "Green"
End Sub
Sub DefaultB_OnClick
Document.BgColor = "White"
Document.Forms(0).Elements(0).Checked = True
End Sub
</SCRIPT>
<TITLE> Radio Buttons </TITLE>
</HEAD>
<BODY BGCOLOR="White">
<FORM METHOD="POST">
<P ALIGN="center">
<FONT COLOR="Blue" SIZE="6"> Color of background
</FONT>
<P ALIGN="center"> <INPUT TYPE="radio" ONCLICK="RadioColor(0)"
CHECKED NAME="ColorR" VALUE="V1">
<FONT SIZE="4">Red</FONT>
<BR> <INPUT TYPE="radio" ONCLICK="RadioColor (1)"
NAME="ColorR" VALUE="V2">
<FONT SIZE="4">Silver</FONT>
<BR> <INPUT TYPE="radio" ONCLICK="RadioColor(2)"
NAME="ColorR" VALUE="V3">
<FONT SIZE="4">Green</FONT>
<P ALIGN="center">
<INPUT TYPE="button" NAME= "DefaultB" VALUE= "Default">
</P>
</FORM>
</BODY>
</HTML>
