Новые формы в языке HTML5
В HTML5 у элементов формы, появились дополнительные атрибуты и значения. Задача новых форм HTML5 состоит в том, чтобы облегчить создание скриптов или даже заменить собой некоторые функции, которые ранее использовались лишь при помощи языков программирования.
Тег <form>
Новые атрибуты и их значения в теге form:
-
autocomplete="on/off"
— включает/отключает автозаполнение у форм, если в браузере автозаполнение отключено, то атрибут не работает -
novalidate="novalidate"
— отключает встроенную проверку данных, введённых пользователем в поля <input type="email" /> и <input type="url" />
Тег <input />
Рассмотрим новые атрибуты HTML5 и их значения в теге input:
autocomplete="on/off"
— включает/отключает автозаполнение у тега input, если в браузере автозаполнение отключено, то атрибут работать не будет.
autofocus="autofocus"
— установка фокуса на элемент.
form="idNameForm"
— связывает тег input, с формой по его атрибуту id
, при условии что тег input, находится вне формы.
formaction="URL"
— указывает на адрес программы, которая будет обрабатывать данные введённые в тег input, аналогичен атрибуту action=" "
у тега form
formenctype=" "
— указывает на способ кодировния данных при их отправки на сервер, аналогичен атрибуту enctype=" "
, у тега form, имеет следующие значения:
application/x-www-form-urlencoded
— не латинские символы кодируются их шестнадцатеричными кодами, пробелы заменяются знаком +
, является значением по умолчанию,
multipart/form-data
— данные не кодируются,
text/plain
— данные не кодируются, но пробелы заменяются знаком +
formmethod="get/post"
— указывает каким методом отправить данные, post
или get
formnovalidate="formnovalidate"
— отключает встроенную проверку данных, аналогичен атрибуту novalidate="novalidate"
у тега form
formtarget="имя окна/_blank/_self/_parent/_top"
— указывет на окно в которое будет загружаться, результат обработки данных, аналогичен атрибуту target=" "
у тега form
list="idName"
— указывает на значение идентификатора id
тега datalist, в котором находится список вариантов появляющиеся при вводе текста в поле.
max="число"
— указывает на максимальное число, которое можно ввести в поле.
min="число"
— указывает на минимальное число, которое можно ввести в поле.
multiple="multiple"
— позволяет указать несколько e-mail адресов, в поле через запятую, или загрузить несколько файлов.
pattern="шаблон"
— позволяет создавать шаблоны, исходя из которых принимается решение о верности или не верности введённых данных, атрибут предназначен для создания полей ввода, для различных типов данных.
placeholder="текст"
— указывает на строку, которая находтся в текстовом поле, она исчезает когда пользователь начинает вводить данные.
readonly="readonly"
— указывает на текстовое поле, в которое пользователь не может ввести данные.
required="required"
— указывает на текстовое поле, которое обязательно должно быть заполненным, если пользователь попытается отправить данные не заполнив это поле, то браузер выдаст об этом сообщение ввиде всплывающей подсказки.
step=" "
— указывает на шаг, при введении чисел.
Атрибут type=" "
У атрибута type=" "
в языке HTML5, добавилось следующие значения:
type="color"
— создаёт виджет выбора цвета.
type="date"
— создаёт поле для ввода даты, при помощи виджета календаря (далее ВК).
type="datetime"
— создаёт поле для ввода даты и времени, (ВК)
type="datetime-local"
— создаёт поле для ввода даты и местного времени, (ВК)
type="email"
— создаёт поле для ввода e-mail
type="month"
— создаёт поле для ввода месяца, (ВК).
type="number"
— создаёт поле для ввода числа.
type="range"
— создаёт ползунок.
type="search"
— создаёт поисковое поле.
type="tel"
— создаёт поле для ввода телефонного номера.
type="time"
— создаёт поле для ввода даты и времени, (ВК), без часового пояса.
type="url"
— создаёт поле для ввода url.
type="week"
— создаёт поле для ввода недели (ВК).
Тег <keygen>
Теги <keygen>
</keygen>
используются для шифровки и расшифровки данных.
Тег <output>
Теги <output>
</output>
создают область для вывода работы скрипта.
Читать далее: Новые технологии HTML5