Элементы формы в HTML5

Новые элементы формы в HTML5

HTML5 имеет несколько новых элементов и атрибутов для форм.

В этой главе рассматриваются новые элементы формы:

• datalist
• keygen
• output

Поддержка браузеров

Элемент datalist

Элемент datalist определяет список опций для поля ввода.

Список создается с элементами option внутри datalist.

Для привязки datalist к полю ввода, необходимо, чтобы атрибут list поля ввода относился к id элемента datalist:

Пример с элементом datalist

Webpage: <input type="url" list="url_list" name="link" />
<datalist id="url_list">
<option label="Xhtml.co.il" value="http://www.xhtml.co.il" />
<option label="Google" value="http://www.google.com" />
<option label="Microsoft" value="http://www.microsoft.com" />
</datalist>

Совет: Элементы option всегда должны иметь значение атрибута.

Элемент keygen

Цель элемента keygen является обеспечение безопасного способа аутентификации пользователей.

Элемент keygen является генератором пары ключей. При отправке формы, два ключа генерируются, один открытый, а другой - закрытый.

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

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

Пример с элементом keygen

<form action="demo_form.asp" method="get">
Username: <input type="text" name="usr_name" />
Encryption:
<keygen name="security" />
<input type="submit" />
</form>

Элемент output

Элемент output используется для различных типов выхода, как расчеты или сценарий выхода:

Пример с элементом output

<output id="result" onforminput="resCalc()"></output>