Значение url
Синтаксис
HTML
<input type="url">
Описание
Тип url
создаёт поле ввода URL-адреса.
Внешний вид
- ‒ URL поле;
- ‒ наведение курсора;
- ‒ фокус.
Поддержка браузерами
Chrome
Поддерж.
Firefox
Поддерж.
Opera
Поддерж.
Maxthon
Поддерж.
IExplorer
Поддерж.
Safari
Поддерж.
iOS
Поддерж.
Android
Поддерж.
Спецификация
Верс. | Раздел |
---|---|
HTML | |
2.0 | |
3.2 | |
4.01 | |
5.0 | 4.10.5.1.4 URL state (type=url) |
5.1 | 4.10.5.1.4. URL state (type=url) |
XHTML | |
1.0 | |
1.1 |
Сопутствующие атрибуты
- autocomplete
- Автозаполнение значения URL поля.
- autofocus
- Автоматческая фокусировка на URL поле после полной загрузки страницы.
- disabled
- Блокировка URL поля.
disabled="disabled"
- form
- Присоединение URL поля к форме.
- list
- Создание списка рекомендованных вариантов URL-адресов.
- maxlength
- Задаёт максимально-допустимое количество вводимых символов.
- minlength
- Задаёт минимально-допустимое количество вводимых символов.
- name
- Присваивает имя URL полю.
- pattern
- Устанавливает критерий/шаблон ввода.
- placeholder
- Указывает текст-подсказку для пустого поля.
placeholder="Текст-подсказка"
- readonly
- Указывает, что URL поле доступно только для чтения (изменение/редактирование запрещено).
- required
- Указывает, что URL поле обязательно для заполнения.
- size
- Задаёт ширину URL поля по количеству вводимых символов.
size="10"
- value
- Указывает значение URL поля (отправляется на сервер или используется скриптами).
Примечание: Данный атрибут должен иметь значение, которое является допустимым URL-адресом не содержит символов «LF» ПЕРЕВОД СТРОКИ [
U+000A
] или «CR» ВОЗВРАТ КАРЕТКИ [U+000D
].value="www.example.ex"
- Глобальные атрибуты
- accesskey, class, contenteditable, data-*, dir, draggable, dropzone, id, inert, lang, spellcheck, style, tabindex, title, translate, xml:lang
Пример использования
Листинг кода
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Значение url (input-type)</title>
</head>
<body>
<h1>Пример с полем ввода URL "type=url"</h1>
<form action="/examples/php-scripts/url.php" method="get">
<fieldset> <legend>Введите URL-адрес</legend>
<p><input type="search" name="input_url" list="url-list" placeholder="http://adres.ex/"></p>
<datalist id="url-list">
<option value="https://www.w3.org/TR/REC-html32" label="HTML 3.2 Спецификация">
<option value="https://www.w3.org/TR/html4/" label="HTML 4.01 Спецификация">
<option value="https://www.w3.org/TR/html5/" label="HTML 5.0 Спецификация">
</datalist>
</fieldset>
<p><input type="reset"> <input type="submit"></p>
</form>
</body>
</html>
<html>
<head>
<meta charset="utf-8">
<title>Значение url (input-type)</title>
</head>
<body>
<h1>Пример с полем ввода URL "type=url"</h1>
<form action="/examples/php-scripts/url.php" method="get">
<fieldset> <legend>Введите URL-адрес</legend>
<p><input type="search" name="input_url" list="url-list" placeholder="http://adres.ex/"></p>
<datalist id="url-list">
<option value="https://www.w3.org/TR/REC-html32" label="HTML 3.2 Спецификация">
<option value="https://www.w3.org/TR/html4/" label="HTML 4.01 Спецификация">
<option value="https://www.w3.org/TR/html5/" label="HTML 5.0 Спецификация">
</datalist>
</fieldset>
<p><input type="reset"> <input type="submit"></p>
</form>
</body>
</html>
Значение url (input-type)