Заглавная страница
Избранные статьи
Случайная статья
Познавательные статьи
Новые добавления
Обратная связь

ТОП 10 на сайте

Приготовление дезинфицирующих растворов различной концентрации

Техника нижней прямой подачи мяча.

Франко-прусская война (причины и последствия)

Организация работы процедурного кабинета

Смысловое и механическое запоминание, их место и роль в усвоении знаний

Коммуникативные барьеры и пути их преодоления

Обработка изделий медицинского назначения многократного применения

Образцы текста публицистического стиля

Четыре типа изменения баланса

Задачи с ответами для Всероссийской олимпиады по праву

Мы поможем в написании ваших работ!

ЗНАЕТЕ ЛИ ВЫ?

Влияние общества на человека

Приготовление дезинфицирующих растворов различной концентрации

Практические работы по географии для 6 класса

Организация работы процедурного кабинета

Изменения в неживой природе осенью

Уборка процедурного кабинета

Сольфеджио. Все правила по сольфеджио

Балочные системы. Определение реакций опор и моментов защемления

Главная Избранные Случайная статья Познавательные Новые добавления Обратная связь FAQ

Кнопки (button, reset, submit)

⇐ ПредыдущаяСтр 12 из 25Следующая ⇒

Свойства

name. Имя объекта.

value. Надпись на кнопке.

Метод

click(). Вызов этого метода тождественен щелчку мышкой по кнопке.

Пример

<html>

<head>

charset=windows-1251">

<!--

function btnClick()

{

var Txt1 = "";

var Txt2 = "";

Txt1 = document.Test.bt.value;

Txt2 = document.Test.bt.name;

document.write("<HR>");

document.write("Вы нажали

кнопку: " + Txt1.bold() +

" с именем: "

+ Txt2.bold());

document.write("<HR>");

}

//-->

</script>

</head>

<H1>Нажатие кнопки</H1>

<INPUT

TYPE="button" NAME="bt" VALUE="Щелкни здесь!"

onClick="btnClick();">

</FORM>

</body>

</html>

РЕЗУЛЬТАТ:

Нажатие кнопки

Начало формы

Конец формы

Флажок (CHECKBOX)

Свойства

name. Имя объекта.

value. Надпись на кнопке.

checked. Состояние флажка: true - флажок установлен, false - флажок не установлен.

defaultChecked. Отражает наличие атрибута CHECKED: true - есть, false - нет.

Метод

click(). Вызов этого метода меняет состояние флажка.

Пример

<html>

<head>

charset=windows-1251">

</head>

<H1>Метод click флажка</H1>

Флажок <INPUT TYPE="checkbox" NAME="ch">

<BR>Состояние флажка можно изменить и этой кнопкой

<INPUT TYPE="button" VALUE="Смена состояния"

onClick="document.Test.ch.click();">

</FORM>

</body>

</html>

Метод click флажка

Начало формы

Флажок

Состояние флажка можно изменить и этой кнопкой

Конец формы

Переключатель (RADIO)

Свойства

name. Имя объекта.

value. Надпись на кнопке.

length. Количество переключателей в группе.

checked. Состояние переключателя: true - переключатель включен, false - выключен.

defaultChecked. Отражает наличие атрибута CHECKED: true - есть, false - нет.

Метод

click(). Вызов этого метода включает переключатель.

Так как группа переключателей имеет одно имя NAME, то к переключателям надо адресоваться как к элементам массива.

Пример

<html>

<head>

content="text/html; charset=windows-1251">

<!--

function btnClick()

{

if(document.Test.Sex[0].checked)

{

document.Test.Sex[1].click();

}

else

{

document.Test.Sex[0].click();

}

//-->

</script>

</head>

<H1>Метод

click группы переключателей</H1>

<INPUT TYPE="RADIO"

NAME="Sex" VALUE ="Man" CHECKED>Мужской

<INPUT TYPE="RADIO"

NAME="Sex" VALUE ="Woman">Женский

<BR>Состояние

переключателей можно изменить и этой кнопкой

</FORM>

</body>

</html>

РЕЗУЛЬТАТ:

Метод click группы переключателей

Начало формы

Мужской

Женский

Состояние переключателей можно изменить и этой кнопкой

Конец формы

Список (SELECT)

Свойства

name. Имя объекта.

selectedIndex. Номер выбранного элемента или первого среди выбранных (если указан атрибут MULTIPLE).

length. Количество элементов (строк) в списке.

options. Массив элементов списка, заданных тегами OPTION.

Каждый элемент массива options является объектом со следующими свойствами:

value. Значение атрибута VALUE.

text. Текст, указанный после тега OPTION.

index. Индекс элемента списка.

selected. Присвоив этому свойству значение true, можно выбрать данный элемент.

defaultSelected. Отражает наличие атрибута SELECTED: true - есть, false - нет.

Методы

focus(). Передает списку фокус ввода.

blur(). Отбирает у списка фокус ввода.

Пример

<html>

<head>

charset=windows-1251">

<!--

function btnClick()

{

sI=Test.Item.selectedIndex;

Txt="";

Txt="Предложено

"+Test.Item.length+" напитков"+

"\nВыбран "+Test.Item.options[sI].text+

" (value= "+Test.Item.options[sI].value+

", index= "+Test.Item.options[sI].index+")";

if(Test.Item.options[sI].defaultSelected)

{Txt+="\nЭтот напиток выбирается по

умолчанию"}

alert(Txt);

}

//-->

</script>

</head>

<H1>Работа с готовым списком</H1>

<OPTION VALUE="tea" SELECTED>Чай

<OPTION VALUE ="coffee">Кофе

<OPTION VALUE ="milk">Молоко

<OPTION VALUE ="cocoa">Какао

<OPTION VALUE ="juice">Сок

</SELECT>

<INPUT TYPE="button" VALUE="Пусть кофе"

onClick="Test.Item.options[1].selected=true;">

<INPUT TYPE="button" VALUE="Посмотрим"

onClick="btnClick();">

</FORM>

</body>

</html>

РЕЗУЛЬТАТ:

Работа с готовым списком

Начало формы

Чай Кофе Молоко Какао Сок

Конец формы

Кроме работы с готовыми списками JavaScript может заполнять список динамически. Для записи нового элемента списка используется конструктор Option c четырьмя параметрами, первый из которых задает текст, отображаемый в списке, второй - значение элемента списка, соответствующее значению атрибута VALUE, третий соответствует свойству defaultSelected, четвертый - свойству selected.

Пример

<html>

<head>

charset=windows-1251">

</head>

<H1>Динамическое заполнение списка</H1>

</SELECT>

<INPUT TYPE="button" VALUE="Переход"

onClick="window.location.href =

document.links[Sel.ListOfLinks.selectedIndex];">

</FORM>

<!--

// Цикл по всем ссылкам

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>

РЕЗУЛЬТАТ:

Динамическое заполнение списка

Начало формы

https://adminvps.ru/ http://htmlweb.ru/links/top_line.php file:///C:/Users/%D0%B0%D0%BD%D0%B4%D1%80%D0%B5%D0%B9/Documents/%D0%9F%D1%80%D0%B5%D0%BF%D0%BE%D0%B4%D0%B0%D0%B2%D0%B0%D0%BD%D0%B8%D0%B5%202013/Web%20%D1%82%D0%B5%D1%85%D0%BD%D0%BE%D0%BB%D0%BE%D0%B3%D0%B8%D0%B8/JavaScript%20-%20%D0%9E%D0%BF%D0%B8%D1%81%D0%B0%D0%BD%D0%B8%D0%B5%20%D1%8F%D0%B7%D1%8B%D0%BA%D0%B0.htm file:///C:/Users/%D0%B0%D0%BD%D0%B4%D1%80%D0%B5%D0%B9/Documents/%D0%9F%D1%80%D0%B5%D0%BF%D0%BE%D0%B4%D0%B0%D0%B2%D0%B0%D0%BD%D0%B8%D0%B5%202013/Web%20%D1%82%D0%B5%D1%85%D0%BD%D0%BE%D0%BB%D0%BE%D0%B3%D0%B8%D0%B8/JavaScript%20-%20%D0%9E%D0%BF%D0%B8%D1%81%D0%B0%D0%BD%D0%B8%D0%B5%20%D1%8F%D0%B7%D1%8B%D0%BA%D0%B0.htm file:///C:/Users/%D0%B0%D0%BD%D0%B4%D1%80%D0%B5%D0%B9/Documents/%D0%9F%D1%80%D0%B5%D0%BF%D0%BE%D0%B4%D0%B0%D0%B2%D0%B0%D0%BD%D0%B8%D0%B5%202013/Web%20%D1%82%D0%B5%D1%85%D0%BD%D0%BE%D0%BB%D0%BE%D0%B3%D0%B8%D0%B8/JavaScript%20-%20%D0%9E%D0%BF%D0%B8%D1%81%D0%B0%D0%BD%D0%B8%D0%B5%20%D1%8F%D0%B7%D1%8B%D0%BA%D0%B0.htm http://htmlweb.ru/ http://htmlweb.ru/ http://htmlweb.ru/html/ http://htmlweb.ru/css/ http://htmlweb.ru/java/ http://htmlweb.ru/php/ http://htmlweb.ru/xml/ http://htmlweb.ru/ajax/ http://htmlweb.ru/service/ http://htmlweb.ru/download/ http://htmlweb.ru/other/ http://htmlweb.ru/java/js.php# http://htmlweb.ru/sitemap/ http://htmlweb.ru/user/signup.php http://htmlweb.ru/user/remember.php http://www.pixelplus.ru/ http://igrovoi-klub.org/ http://www.solaris-sc.com.ua/ http://htmlweb.ru/java/js.php#Array http://htmlweb.ru/java/js.php#Date http://htmlweb.ru/java/js.php#Window http://htmlweb.ru/java/js.php#Document http://htmlweb.ru/java/js.php#Form http://htmlweb.ru/java/js.php#Cookie http://htmlweb.ru/java/js1.php http://htmlweb.ru/java/js1.php http://htmlweb.ru/java/js2.php http://htmlweb.ru/java/js2.php http://htmlweb.ru/java/js3.php http://htmlweb.ru/java/js3.php http://htmlweb.ru/java/js4.php http://htmlweb.ru/java/js4.php http://htmlweb.ru/java/js5.php http://htmlweb.ru/java/js5.php http://htmlweb.ru/java/js6.php http://htmlweb.ru/java/js6.php http://htmlweb.ru/java/js7.php http://htmlweb.ru/java/js7.php http://kdg.htmlweb.ru/ http://www.dstu.edu.ru/ http://www.moidomovenok.ru/ http://www.vsetaksi.ru/

Конец формы

Поле ввода (TEXT)

Свойства

name. Имя объекта.

defaultValue. Начальное содержимое поля.

value. Текущее содержимое поля.

Методы

focus(). Передает полю фокус ввода.

blur(). Отбирает у поля фокус ввода.

select(). Выделяет содержимое поля.

Пример

<html>

<head>

charset=windows-1251">

<!--

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>

<H1>Заполните анкету</H1>

<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>

</FORM>

</body>

</html>

РЕЗУЛЬТАТ:

Заполните анкету

Начало формы

Фамилия:
Имя:
Возраст:
Телефон:

Конец формы

Обратите внимание на то, что символы фамилии и имени при потере фокуса соответствующими полями преобразуются в прописные. Для этого используется метод toUpperCase, определенный во встроенном классе строк.

Текстовая область (TEXTAREA)

Свойства

name. Имя объекта.

defaultValue. Начальное содержимое области.

value. Текущее содержимое области.

Методы

focus(). Передает области фокус ввода.

blur(). Отбирает у области фокус ввода.

select(). Выделяет содержимое области.

Пример

<html>

<head>

<!--

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>

<H1>Отправьте телеграмму</H1>

<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>

</FORM>

</body>

</html>

РЕЗУЛЬТАТ:

Отправьте телеграмму

Начало формы

Явка в норме

Явка провалена

Конец формы

Поле ввода пароля (PASSWORD)

Свойства

name. Имя объекта.

defaultValue. Начальное содержимое поля.

value. Текущее содержимое поля.

Методы

focus(). Передает полю фокус ввода.

blur(). Отбирает у поля фокус ввода.

select(). Выделяет содержимое поля.

Пример

<html>

<head>

content="text/html; charset=windows-1251">

<!--

function Complete()

{

if(Sel.Pwd.value==Sel.Pwd1.value)

alert("Вас зарегистрировали\nID="+Sel.Id.value+"\nPassword="+Sel.Pwd.value);

else

alert("Ошибка при вводе

пароля\nПопробуйте еще раз");

}

//-->

</script>

</head>

<H1>Регистрация</H1>

<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>

</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 - установить для него такое время автоматического удаления, которое уже прошло.

⇐ Предыдущая 7 8 9 10 111213 14 15 16 Следующая ⇒

Приготовление дезинфицирующих растворов различной концентрации

Занятость населения и рынок труда

Социальный статус семьи и её типология

Последнее изменение этой страницы: 2016-12-28; просмотров: 283; Нарушение авторского права страницы; Мы поможем в написании вашей работы!

infopedia.su Все материалы представленные на сайте исключительно с целью ознакомления читателями и не преследуют коммерческих целей или нарушение авторских прав. Обратная связь - 3.17.150.163 (0.138 с.)