Теория

И т.д.

4) Добавить проверку на недопустимость паролей длиной менее 4 символов; (Для этого можно воспользоваться свойством length объекта строки); Пример:

document.FirstForm.Password1.value.length

Текст функции process:

function process(nForm)

{

var result,v,n;

str=document.FirstForm.FirstName.value+" " +

document.FirstForm.LastName.value+"\n"+"Место жительства: "+document.FirstForm.Address.value;

if ((document.FirstForm.Password1.value == document.FirstForm.Password2.value)

&& (document.FirstForm.Password2.value.length>3))

{

alert(str);

result=confirm("Войти в систему?");

}

else

{

alert("Пароль набран не правильно!!");

result=0;

}

if (result==1)

{

alert("Регистрация в системе прошла успешно!!");

v=0;n=0;

if (document. forms[0]. check1.checked==1) v++

else n++;

if (document. forms[0]. check2.checked==1) v++

else n++;

if (document. forms[0]. check3.checked==1) v++

else n++;

if (document. forms[0]. check4.checked==1) v++

else n++;

if (document. forms[0]. check5.checked==1) v++

else n++;

alert("Ответов ДА-"+v+" Ответов НЕТ-"+n);

}

else alert("Регистрация не прошла");

}

5) Изменить подсчет количества положительных и отрицательных ответов на цикл, осуществляя просмотр соответствующих элементов (по номерам). Пример:

v=0;n=0;

for(i=5;i<12;i++)

if (document.forms[0]. elements[i]. checked==1) v++

else n++;

alert("Ответов ДА-"+v+" Ответов НЕТ-"+n);

Упражнение 5. Использование переключателей.

В данном задании необходимо создать новую форму, содержащую переключатели (2 группы по 3-5 переключателей в каждой) и кнопку SUBMIT. Кроме того, необходимо написать новую функцию для обработки информации от данной формы – она должна выводить сообщение о номере выбранного элемента в первой и второй группе.

Для выполнения данного задания будем использовать файл, сформированный нами в 4-ом упражнении. Построение переключателей проходит в той же последовательности, что и создание флажков. В качестве параметра TYPE выступает значение radio. Возникает вопрос как определить к какой группе относится переключатель. Решение состоит в том, что у каждого переключателя поле NAME совпадает с именем группы (и наоборот имя группы совпадает с именем любого из переключателей входящих в группу). Т.о. для создания группы переключателя необходимо создать хотя бы один переключатель и задать в нем поле NAME. Построим две группы переключателей с именами групп соответственно: group1 и group2. Обратите внимание, что значения по умолчанию устанавливаются так же как и у флажков через параметр CHECKED, но значение истина (1) может быть только у одного члена группы.

<form name="SecondForm">

<input type=radio name="group1">

<input type=radio name="group1">

<input type=radio name="group1" checked=1>

<input type=radio name="group1">

<input type=radio name="group2">

<input type=radio name="group2" checked=1>

<input type=radio name="group2">

<input type=submit onClick="">

</form>

1) Протестируйте данный пример. Определите какие переключатели относятся к первой, а какие ко второй группе. Попробуйте переставить строки местами, убедитесь, что принадлежность группе определяется полем NAME.

2) Добавим новую функцию (newprocess), обрабатывающую значения из второй формы. Для обращения к форме и к ее элементам будем использовать соответствующие массивы (см. переключатели). Не забудьте отредактировать пункт onClick кнопки submit.

function newprocess()

{

var str1,str2;

str1="";

str2="";

for (i=0;i<4;i++) str1+=document.forms[1].elements[i].checked+" ";

for (;i<7;i++) str2+=document.forms[1].elements[i].checked+" ";

alert(str1+"/"+str2);

}

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

3) Добавьте форматирование, т.о. чтобы переключатели располагались друг под другом в двух столбцах (в каждом столбце по группе).

4) В приведенном примере мы обращались к значениям переключателей через elements, но можно аналогично обращаться к этим же параметрам используя имя группы, пример:

document.forms[1].group1[1].checked

Упражнение 6. Использование списков.

Во вторую форму (см. Упражнение 5) вместо флажков необходимо включить два списка. Первый представляет собой всплывающий список городов из которых можно выбрать только один город. Второй – список городов (с полосой прокрутки) из которых можно выбрать только один.

Теория:

Для создания подобных списков используется контейнер <select> </select>, который имеет следующие параметры: NAME – с этим параметром мы уже знакомы, SIZE – определяет количество видимых строк на экране (его мы рассмотрим ниже на примере).

Для указания элементов списка используется тэг <option>, который включается в контейнер списка <select>. Тэг <option> имеет следующие параметры: value – указывает, какое значение будет передано обработчику в случае выбора данного объекта из списка и selected – определяет какое значение из списка будет использоваться по умолчанию. Рассмотрим следующий пример:

<select name="city" size=1 >

<option value=1> Москва

<option value=”Уфа” selected> Уфа

<option value=3> Рига

<option value=4> Санкт-Петербург

<option value=5> Саратов

<option value=6> Липецк

</select>

1) Данный список необходимо добавить во вторую форму (см. упражнение 5).

2) Изменим функцию newprocess, добавив в нее следующую строку:

alert(""+document.forms[1].city.value);

Остальные строки данной функции закомментируем: /* */.

3) Добавим второй список, у которого содержимое контейнера не изменяется, но изменятся два параметра: имя списка – city2, параметр SIZE равен 5.

<select name="city2" size=5>

Какие изменения с точки зрения визуального представления вы наблюдаете?

4) Изменим функцию newprocess, добавив в нее следующую строку:

alert(""+document.forms[1].city2.value);

Какие сообщения мы будем получать, выбирая различные города из представленного списка. Почему?

Какой город используется по умолчанию? Как сменить город по умолчанию?

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

5) Используя тэги таблицы, установите форматирование для новых встроенных объектов.

Дата добавления: 2015-05-26