Элементы формы для создания и обработки тестового опроса

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

Рассмотрим листинг более подробно.

<html > - определение документа как веб-страницы.
<head> - определение заголовка документа.
<script > - начало сценария. Он вынесен в заголовок страницы, так как при обращении к функции сценария браузер уже должен знать, где она находится. На самом деле сценарий с функцией можно прописывать в любом месте документа, но если используются глобальные переменные, все же желательно прописывать в заголовке документа.
function proverka () - начало функции.
{ - фигурная скобка обязательна, так как показывает начало функции. По окончании функции ставится закрывающая фигурная скобка.
result = 0 - обнуление переменной, подсчитывающей количество правильных ответов.
if (document.test.аа[2].checked) result + +- условие (если в текущем документе в форме с именем test активизирован второй элемент массива с именем аа, то увеличить значение переменной result на единицу). В свою очередь, чтобы было более понятно, надпись result++ равносильна надписи result=result + l. Если оператор не один, то каждый должен заключаться в фигурные скобки {}.
if (document.test.bb[0].checked) result++- условие (если в текущем документе в форме с именем test активизирован нулевой элемент массива с именем bb, то увеличить значение переменной result на единицу).
if (document. test. сс .value= = 3 ) result + +- условие (если в текущем документе в форме с именем test значение выбранного элемента массива с именем сс равно 3, то увеличить значение result на единицу). Обратите внимание, что равенство обозначается двойным знаком равно ==.
alert("Правильных ответов " + result + " из трех возможных" ) - вывести надпись с указанием количества правильных ответов.
} - фигурная скобка, закрывающая тело функции.
</scriptx/head> - теги окончания тела сценария и заголовка документа соответственно.
<body> - начало тела документа.
<form name=" test" > - открытие формы элементов с именем test.
<div>Bonpoc 1.</b> Какая кнопка в правом верхнем углу окна его закрывает? <br>- начало первого раздела с указанием текста вопроса.
<input type=radio name=aa> Кнопка "минус"<br> - создание переключателя radio с именем аа и надписью рядом с ним.
<input type=radio name=aa> Кнопка "квадрат" <br> - аналогично предыдущей строке.
<input type=radio name=aa> Кнопка "крестик"- аналогично предыдущим двум строкам.
< /div> - закрытие первого раздела, перевод строки.
<div> <b>Bonpoc 2.</b> В случае нажатия кнопки "минус" произойдет: <br> - начало второго раздела с указанием текста вопроса.
<input type=checkbox name=bb>Сворачивание окна с Рабочего стола<Ьг> - создание с независимой фиксацией (флажок) checkbox с именем bb и надписью рядом с ним.
<input type=checkbox name=bb >Изменение размера окна<br>-аналогично предыдущей строке.
<input type=checkbox name=bb >Закрытие приложения - аналогично предыдущим двум строкам.
</div> <br>> - закрытие второго раздела, перевод строки.
<divxb>Bonpoc 3.</b> При решении следующей задачи: 2+2*2 ответ равен: <br> - начало третьего раздела с указанием текста вопроса.
<select name=cc> - создание раскрывающегося списка с именем сс.
<option value=1> - присвоение первому элементу списка значения «не определено», или «пусто».
<option value=2>8 - присвоение второмуэлементу списка значения 8.
<option value=3>6 - присвоение третьему элементу списка значения 6.
</select > - завершение списка.
</divxbr> - конец третьего раздела, перевод строки.
<input type = button valuer "Проверить" onClick= "proverka ();"> - определение командной кнопки с надписью Проверить, при нажатии которой активизируется функция proverka {).
</form> </body> </html> - завершение формы, завершение тела документа, конец веб-страницы.

Рассмотрим, на что нужно обратить внимание при использовании элементов данного листинга.
В скобках рядом с именем функции можно ставить передаваемые ей параметры или оставлять их пустыми, но они должны быть.

В случае вызова в функции значения элемента, используемого в форме, необходимо указывать полный адрес данного элемента: документ. имя формы.имя элемента.

Тело функции начинается с открывающейся скобки { и заканчивается закрывающейся }, как и совокупность нескольких операторов - так называемый составной оператор, применяемый в структурах ветвления или цикла.

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

В структуре ветвления может быть использовано составное логическое условие. Главное при этом - не запутаться в скобках: количество открытых скобок всегда должно равняться количеству закрытых.
Таким образом, при правильном ответе на все предложенные вопросы пользователь получит страницу, с тестовым заданием с выводом результатов.

Тэги: различными, создадим, вариантами, список, вопросов, ответов, вопрос

← Сложные сценарии обработки JS		Условный оператор при выборе последовательности действий →