Томский политехнический университет
Опубликован: 01.08.2012 | Доступ: свободный | Студентов: 20654 / 2315 | Оценка: 3.91 / 4.09 | Длительность: 12:36:00
Лекция 17:

HTML5. Работа с веб - формами

Свойства и методы формы

Для форм в JavaScript определены следующие свойства, часть из которых представляет собой трансляцию атрибутов HTML элемента form. Свойства и их описание представлены в таблице 17.2 :

Таблица 17.2.
Свойство Описание
name Имя формы
action Адрес файла серверного сценария, который будет обрабатывать заполненную и переданную форму
method Метод передачи данных серверу
encoding Тип содержимого, используемый для отправки формы на сервер
target Имя окна или фрейма для загрузки документа, сгенерированного сценарием на основании принятых из формы данных
length Количество элементов формы
elements[] Массив элементов формы

Для формы определены два метода, эмулирующие нажатие на кнопки типа submit и reset:

  • submit();
  • reset().

Свойства элементов управления

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

Общими для всех элементов форм являются следующие свойства:

  • name – наименование элемента формы;
  • value – строка, определяющее значение, отображаемое элементом и / или используемая серверным сценарием, обрабатывающим полученные из формы данные;
  • disabled – определяет доступность элемента в текущем контексте;
  • form – наименование формы.

Ряд элементов формы обладает свойствами отличными от других элементов.

Свойства элемента input:

  • type – тип элемента input;
  • defaultValue – текст, первоначально отображающийся в элементе формы (только для text и password);
  • checked – булево значение, определяющее отмечен ли в данный момент элемент формы (для radio и checkbox);
  • defaultChecked – булево значение, определяющее отмечен ли элемент формы по умолчанию (для radio и checkbox).

Для элемента textarea помимо прочих определено свойство defaultValue – текст, первоначально отображающийся в многострочном текстовом поле.

Свойства определенные только для элемента select:

  • length – количество элементов списка;
  • options[] – массив элементов списка;
  • selectedIndex – номер выбранного в текущий момент элемента списка.

Свойства, определенные только для элемента option:

  • text –строка, задающая текст элемента списка;
  • selected – булево значение, определяющее выбран ли в данный момент элемент списка;
  • defaultSelected – булево значение, определяющее выбран элемент списка по умолчанию.

С событиями элементов форм можно ознакомиться в списке материалов для самостоятельного изучения.

Ключевые термины и определения

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

Краткие итоги

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

Более подробно создание веб - форм будет рассмотрено в рамках практического занятия №2. С отдельными элементами веб - форм мы также будем сталкиваться при выполнении других практических заданий.

Список материалов для самостоятельного изучения

  1. http://www.w3schools.com/html/html_forms.asp
  2. http://www.w3schools.com/tags/tag_input.asp
  3. http://ktonanovenkogo.ru/html/html-new/html-dlya-nachinayushhix-sozdanie-i-rabota-s-html-formami-tegi-form-input-select-option-textarea-1.html
  4. http://www.html-form-guide.com/html-form/html-form-input.html
  5. http://vvz.nw.ru/Lessons/JavaScript/Forms/JS-form-elements-method-evetns.htm
Сергей Крупко
Сергей Крупко

Добрый день.

Я сейчас прохожу курс  повышения квалификации  - "Профессиональное веб-программирование". Мне нужно получить диплом по этому курсу. Я так полагаю нужно его оплатить чтобы получить диплом о повышении квалификации. Как мне оплатить этот курс?

 

Галина Башкирова
Галина Башкирова

Здравствуйте, недавно закончила курс по проф веб программиованию, мне прислали методические указания с примерами тем, однако темы там для специальности 

Системный администратор информационно-коммуникационных» систем.
Мне нужно самой найти тему? или делать по высланным темам