Лабораторные работы МИРЭА JavaScript (1017114), страница 8
Текст из файла (страница 8)
</SELECT>
<!-- Кнопка активизации выбранной ссылки-->
<INPUT TYPE="button" VALUE="Переход"
onClick="window.location.href =
document.links[Sel.ListOfLinks.selectedIndex];">
</FORM>
<A HREF="http://tnk-ug.ru/kdg/"></A>
<A HREF="http://www.dstu.edu.ru/"></A>
<A HREF="http://www.tnk-ug.ru/"></A>
<A HREF="http://www.dmm.ru/"></A>
<script type="text/javascript">
<!--
// Цикл по всем ссылкам
for(i=0; i<document.links.length; i++)
{
// Создание i-элемента списка и запись в него ссылки
document.Sel.ListOfLinks.options[i] = new Option(document.links[i], i, false,
false);
}
// Выделение первого элемента в списке
document.Sel.ListOfLinks.selectedIndex = 0;
//-->
</script>
</body>
</html>
Динамическое заполнение списка
Начало формы
Конец формы
Поле ввода (TEXT)
Свойства
-
name. Имя объекта.
-
defaultValue. Начальное содержимое поля.
-
value. Текущее содержимое поля.
Методы
-
focus( ). Передает полю фокус ввода.
-
blur( ). Отбирает у поля фокус ввода.
-
select( ). Выделяет содержимое поля.
Пример
<html>
<head>
<meta http-equiv=Content-Type content="text/html;
charset=windows-1251">
<script type="text/javascript">
<!--
function Complete()
{
Elem="Фамилия: " + Sel.Family.value +
"\nИмя: " + Sel.Name.value +
"\nВозраст: " + Sel.Age.value +
"\nТелефон: " + Sel.Phone.value;
alert(Elem);
}
function CheckAge(age)
{
if(age<18)
return "18";
else
return
age;
}
//-->
</script>
</head>
<body lang=RU>
<H1>Заполните анкету</H1>
<FORM NAME="Sel">
<!-- Анкета -->
<TABLE>
<TR><TD><B>Фамилия:<B></TD><TD><INPUT NAME="Family" SIZE=20
onBlur="this.value=this.value.toUpperCase()"></TD></TR>
<TR><TD><B>Имя:<B></TD><TD><INPUT
NAME="Name" SIZE=20
onBlur="this.value=this.value.toUpperCase()"></TD></TR>
<TR><TD><B>Возраст:<B></TD><TD><INPUT NAME="Age" SIZE=3
VALUE="18"
onBlur="this.value=CheckAge(this.value)"
onFocus="this.select()"></TD></TR>
<TR><TD><B>Телефон:<B></TD><TD><INPUT NAME="Phone"
SIZE=10></TD></TR>
</TABLE>
<!-- Кнопки готовности и сброса -->
<INPUT TYPE="button" VALUE="Готово" onClick="Complete();">
<INPUT TYPE="reset" VALUE="Сброс">
</FORM>
</body>
</html>
Заполните анкету
Начало формы
Фамилия: |
|
Имя: |
|
Возраст: |
|
Телефон: |
|
Конец формы
Обратите внимание на то, что символы фамилии и имени при потере фокуса соответствующими полями преобразуются в прописные. Для этого используется метод toUpperCase, определенный во встроенном классе строк.
Текстовая область (TEXTAREA)
Свойства
-
name. Имя объекта.
-
defaultValue. Начальное содержимое области.
-
value. Текущее содержимое области.
Методы
-
focus( ). Передает области фокус ввода.
-
blur( ). Отбирает у области фокус ввода.
-
select( ). Выделяет содержимое области.
Пример
<html>
<head>
<meta http-equiv=Content-Type content="text/html; charset=windows-1251">
<script type="text/javascript">
<!--
OK="Тетя Эльза чувствует себя хорошо.\n
Юстас.";
Problem="Тетя Эльза заболела.\n
Юстас.";
function getDate()
{
today=new Date();
return
today.toLocaleString()+"\n";
}
function CheckRadio(form,value)
{
if(value=="Good")
form.Letter.value=getDate()+OK;
else
form.Letter.value=getDate()+Problem;
}
//-->
</script>
</head>
<body lang=RU>
<H1>Отправьте телеграмму</H1>
<FORM NAME="Sel">
<P><INPUT TYPE="radio" NAME="Code" VALUE="Good"
onClick="if(this.checked) CheckRadio(this.form,this.value);">
Явка в норме
<BR><INPUT TYPE="radio" NAME="Code" VALUE="Bad"
onClick="if(this.checked) CheckRadio(this.form,this.value);">
Явка провалена
<P>
<TEXTAREA NAME="Letter" ROWS=3 COLS=35>
</TEXTAREA>
<INPUT TYPE="button" VALUE="Готово" onClick="alert(Sel.Letter.value);">
<INPUT TYPE="reset" VALUE="Сброс">
</FORM>
</body>
</html>
Отправьте телеграмму
Начало формы
Явка в норме
Явка провалена
Конец формы
Поле ввода пароля (PASSWORD)
Свойства
-
name. Имя объекта.
-
defaultValue. Начальное содержимое поля.
-
value. Текущее содержимое поля.
Методы
-
focus( ). Передает полю фокус ввода.
-
blur( ). Отбирает у поля фокус ввода.
-
select( ). Выделяет содержимое поля.
Пример
<html>
<head>
<meta http-equiv=Content-Type
content="text/html; charset=windows-1251">
<script type="text/javascript">
<!--
function Complete()
{
if(Sel.Pwd.value==Sel.Pwd1.value)
alert("Вас зарегистрировали\nID="+Sel.Id.value+"\nPassword="+Sel.Pwd.value);
else
alert("Ошибка при вводе
пароля\nПопробуйте еще раз");
}
//-->
</script>
</head>
<body lang=RU>
<H1>Регистрация</H1>
<FORM NAME="Sel">
<TABLE>
<TR><TD><B>Идентификатор:<B></TD><TD><INPUT NAME="Id" SIZE=20
onBlur="this.value=this.value.toUpperCase()"></TD></TR>
<TR><TD><B>Пароль:<B></TD>
<TD><INPUT TYPE="password"
NAME="Pwd" SIZE=20
onFocus="this.select();"></TD></TR>
<TR><TD><B>Проверка пароля:<B></TD>
<TD><INPUT TYPE="password"
NAME="Pwd1" SIZE=20
onFocus="this.select();"></TD></TR>
</TABLE>
<INPUT TYPE="button" VALUE="Готово" onClick="Complete();">
<INPUT TYPE="reset" VALUE="Сброс">
</FORM>
</body>
</html>
Регистрация
Начало формы
Идентификатор: |
|
Пароль: |
|
Проверка пароля: |
|
Конец формы
Cookie
Cookie - это свойство HTML-документа. Представляет собой набор строковых параметров, каждый из которых имеет имя и значение. Сценарий JavaScript может создавать cookie для HTML-документа, определяя в нем произвольное количество параметров и задавая для них произвольные значения. После создания такой набор параметров становится принадлежностью данного конкретного HTML-документа и может быть проанализирован, изменен или удален сценарием JavaScript. Подробное описание технологии cookie.
Создание cookie
В сценарии JavaScript cookie создается с помощью свойства document.cookie. Пары имя-значение не могут содержать пробелов, запятых и точек с запятыми. Поэтому все эти символы должны быть заменены на соответствующие escape-последовательности. JavaScript имеет две функции, обрабатывающие escape-последовательности: escape и unescape.
Пара имя-значение является единственным необходимым параметром при создании cookie. Указание только пары имя-значение создает cookie, который сохраняется только на протяжении текущего сеанса брaузера. При создании cookie можно задать дату его автоматического удаления. В этой паре надо указать имя expires и значение в стандартном формате времени по Гринвичу (GMT). Простейшим способом преобразования в формат GMT является использование одного из методов встроенного класса Date:toGMTString. Кроме этого, создавая cookie, можно указать также путь (path), домен (domain) иинформацию безопасности. Извлечь эту информацию нельзя.
Удаление cookie
Самый простой способ удаления cookie - установить для него такое время автоматического удаления, которое уже прошло.
Практическое применение cookie
-
Индивидуальная настройки параметров Web-страниц.
-
Хранение товара, выбранного посетителем виртуального магазина. Можно выбрать товары на разных страницах, а потом сделать общий заказ.
-
Хранение текущего состояния сетевой игры.
Пример
<html>
<head>
<meta http-equiv=Content-Type
content="text/html; charset=windows-1251">
</head>
<body>
<script type="text/javascript">