Рассмотрим примеры работы с различными элементами Форм.

Получение информации из текстовой строки.

Для определения текстовой строки мы задаем параметрtype="text" в операторе input.
После заполнения строки пользователь нажимает правой кнопкой мыши на какую-либо точку экрана вне поля текста (то есть элемент теряет фокус ввода). При этом управление получает созданная нами функция getname, задаваемая в параметре onBlur.
В свою очередь, параметр этой функции this.value содержит значение строки текста.
Эту строку в функции getname мы выведем на экран в специальном окне с помощью стандартной функции alert.
И все это выглядит следующим образом:

<script language="JavaScript">
function getname(str) {
alert(str);
}
</script>
Введите Ваше имя:
<form>
<input type="text" name="name"
onBlur="getname(this.value); return true;" value="Insert text">
</form>

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

Введите Ваше имя:

(Боюсь, что программистам все ясно и без моих комментариев,а остальных я запутал окончательно. Но я советую разбирать этот пример, пока Вы не поймете, тогда будет легко понять дальнейшее.)
Данный пример можно упростить, удалив функцию getname, и записав:onBlur="alert(this.value); return true;".
Проверьте.

Кроме уже рассмотренного обработчика событий onBlur(), который вызывается, когда text утрачивает фокус ввода,существуют еще 2 обработчика событий:
- onchange() - вызывается, когда пользователь изменяет значение в элементе text и этот обьект утрачивает фокус ввода,
- onfocus() - вызывается, когда пользователь перемещает фокус ввода с клавиатуры в обьект text.
Вставьте каждый из этих обработчиков событий в вышеприведенный пример вместо onBlur() и проверьте действие программы.

Получение информации из текстового поля.

Этот пример строится на тех же принципах, что и предыдущий:

<script language="JavaScript">
function getname(str) {
alert(str);
}
</script>
Введите все, что Вы хотите:
<form>
<textarea name="name" cols=30 rows=5 wrap=virtual
onBlur="getname(this.value); return true;">
Insert any text
</textarea>
</form>

Посмотрите, как он выполняется:

Введите все, что Вы хотите:

Обработка нажатия кнопок.

Стандартная кнопка задается параметром type="button" в операторе input.
При нажатии кнопки выполняется созданная нами функция, заданная в параметре onclick, то есть onPush().
Эта функция выводит текст "H E L L O" в новое окно.
Ниже приведен этот пример:

<script language="JavaScript">
function onPush() {
alert("H E L L O !"); return true;
}
</script>
<form>
<input type="button" name="Button1"
value="Push" onclick="onPush(); return true;">
</form>

А теперь нажмите на ниже приведенную кнопку.

В первом примере данного раздела для указания значения текстового поля мы пользовались аттрибутом this.value, что означает "значение данного элемента". Но мы можем захотеть работать с полем другого элемента.
Тогда применим полное имя, имеющее следующий формат:
document.<Имя-формы>.<Имя-Элемента>.value,где:
Имя-формы - значение параметра name команды form,
Имя-Элемента - значение параметра name команды input.

В данном примере мы обрабатываем форму myForm1, содержащую одно текстовое поле, названное myText и 2 кнопки: Button1 и Button2.
Для каждой из этих кнопок создана функция, записывающая в текстовое поле сообщение о нажатии "своей" кнопки.
Программа выглядит следующим образом:

<script language="JavaScript">
function FirstFunction() {
document.myForm1.myText.value ="Вы нажали первую кнопку";
}
function SecondFunction() {
document.myForm1.myText.value ="Вы нажали вторую кнопку";
}
</script>
<form name="myForm1">
<input type="text" name="myText" size=30
value="Нажмите одну из кнопок"><p>
<input type="button" name="Button1"
value="Первая кнопка"
onclick="FirstFunction(); return true;">
<input type="button" name="Button2"
value="Вторая кнопка" onclick="SecondFunction(); return true;">
</form>

Посмотрите, как она выполняется: