Атрибут value | wm-school
Атрибут value (от англ. «value» — «значение») присваивает элементу значение.
Для элементов <button>, <input> и <option>, атрибут value определяет начальное значение элемента.
Для элемента <li> определяет стартовое значение для числового маркера элементов списка. Маркер для последующих элементов списка будет увеличиваться на единицу от данного значения.
Для элемента <progress> определяет, насколько выполнена текущая задача.
Для элемента <param> определяет значение параметра. Атрибут value используется вместе с атрибутом name, чтобы установить параметры для плагина, определенного в элементе <object>.
Синтаксис
<element value="[значение]">Значения
Любая текстовая строка.
Значение по умолчанию
Нет.
Применяется к тегам
Отличия HTML 4.01 от HTML 5
Нет.
Примеры использования:
Атрибут value (Элемент <button>)
Значение кнопки отправляется на сервер только в том случае, если сама эта кнопка определена как кнопка отправки данных формы.
При использовании элемента <button> в HTML форме Internet Explorer до версии 8 отправляет на сервер текст между тегами <button> и </button>, в то время как остальные браузеры отправляют на сервер значение атрибута value.
Две кнопки с одинаковыми именами, которые при нажатии отправляют разные значения:
Пример HTML:
Попробуй сам<form action="action_form.php" method="get">
Выберите ваш любимый предмет::
<button name="subject" type="submit" value="fav_HTML">HTML</button>
<button name="subject" type="submit" value="fav_CSS">CSS</button>
</form>Атрибут value (Элемент <input>)
В зависимости от типа элемента атрибут value выступает в следующей роли:
- для типов «button«, «reset«, «submit» — он определяет текст на кнопке;
- для типов «text«, «password«, «hidden» — он определяет начальное значение поля ввода;
- для типов «checkbox«, «radio«, «image» — он определяет значение, ассоциированное с элементом ввода (также это значение, отправляемое на сервер).
Пример HTML:
Попробуй сам<form action="action_form.php">
Имя: <input type="text" name="firstname" value="Иван"><br>
Фамилия: <input type="text" name="lastname" value="Иванов"><br>
<input type="submit" value="Отправить">
</form>Атрибут value (Элемент <li>)
Атрибут value может иметь только числовое значение и используется только с упорядоченными списками <ol>.
Атрибут value в упорядоченном HTML списке:
Пример HTML:
Попробуй сам<ol> <li value="100">Кофе</li> <li>Чай</li> <li>Молоко</li> <li>Вода</li> <li>Сок</li> <li>Пиво</li> </ol>
Атрибут value (Элемент <option>)
Выпадающий список внутри HTML формы:
Пример HTML:
Попробуй сам<form action="action_form.php">
<select name="color"> <!--выпадающий список-->
<!--<select name="color" size=3> <!--список с прокруткой-->
<option value="white">Белый</option>
<option value="green">Зеленый</option>
<option value="blue">Синий</option>
<option value="red">Красный</option>
<option value="black">Черный</option>
</select>
<input name="Submit" type='submit' value='Отправить'>
</form>Атрибут value (Элемент <progress>)
Процесс загрузки:
Атрибут value (Элемент <param>)
В качестве значения данного параметра указывается любое допустимое значение, предназначенное для передачи встраиваемому объекту. (Таким образом, допустимость значений определяется встраиваемым объектом.)
Пример HTML:
Попробуй сам<object data="document.html" type="text/html">
<param name="bgcolor" value="#ffeeaa">
</object>Поддержка браузерами
Атрибут value имеет следующую поддержку браузерами для каждого элемента:
| Элемент | ||||||
| <button> | 8+ | 1+ | 6+ | 1+ | 1+ | 1+ |
| <input> | 2+ | 1+ | 1+ | 1+ | 1+ | 1+ |
| <li> | 2+ | 1+ | 4+ | 1+ | 1+ | |
| <option> | 3+ | 1+ | 4+ | 1+ | 1+ | 1+ |
| <progress> | 10+ | 8+ | 11+ | Да | 6+ | 16+ |
| <param> | 3+ | 1+ | 4+ | 1+ | 1+ | 1+ |
| Элемент | ||||
| <button> | 1+ | 1+ | 6+ | 1+ |
| <input> | 1+ | 1+ | 6+ | 1+ |
| <li> | 1+ | 1+ | 6+ | 1+ |
| <option> | 1+ | 1+ | 6+ | 1+ |
| <param> | 1+ | 1+ | 6+ | 1+ |
Спецификации
| Спецификация | Статус |
|---|---|
| HTML 4.01 (W3C) | Рекомендация (value-BUTTON) |
| HTML 5 (W3C) | Рекомендация (value-BUTTON) |
| HTML 5.1 (W3C) | Рекомендация (value-BUTTON) |
Учебник HTML
HTML уроки: HTML Атрибуты
Атрибут value | HTML | WebReference
Определяет значение пункта списка, которое будет отправлено на сервер. На сервер отправляется пара «имя=значение», где имя задаётся атрибутом name элемента <select>, а значение — атрибутом value выделенных пунктов списка. Значение может как совпадать с текстом пункта, так быть и самостоятельным. Также атрибут value применяется для получения значений данных через скрипты.
Синтаксис
<option value="<текст>">...</option>Значения
Любая текстовая строка.
Значение по умолчанию
Пример
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>OPTION, атрибут value</title>
<script>
function dataSelect(f) {
n = f.hero.selectedIndex
if(n) alert("Выбран герой: " + f.hero.options[n].value)
}
</script>
</head>
<body>
<form action="option1.php">
<p><select name="hero">
<option>Выберите героя</option>
<option value="Чебурашка">Чебурашка</option>
<option value="Крокодил Гена">Крокодил Гена</option>
<option value="Шапокляк">Шапокляк</option>
<option value="Крыса Лариса">Крыса Лариса</option>
</select>
<input type="button" value="OK"></p>
</form>
</body>
</html> Браузеры
В таблице браузеров применяются следующие обозначения.
- — элемент полностью поддерживается браузером;
- — элемент браузером не воспринимается и игнорируется;
- — при работе возможно появление различных ошибок, либо элемент поддерживается с оговорками.
Число указывает версию браузреа, начиная с которой элемент поддерживается.
×Автор и редакторы
Автор: Влад Мержевич
Последнее изменение: 02.01.2017
Редакторы: Влад Мержевич
HTML атрибут value | назначение, значения, примеры
Атрибут value — задает начальное значение для элемента.
Для input — это значение элемента формы, которое будет отправлено на сервер или получено с помощью клиентских скриптов.
На сервер отправляется пара «имя=значение», где имя задается параметром name тега input, а значение — параметром value.
Параметр value для кнопок (type=submit|reset|button) устанавливает текстовую надпись на них. Для текстовых полей (type=»text|file») указывает предварительно введенную строку. Для флажков и переключателей (type=checkbox|radio) уникально определяет каждый элемент.
Для тега option этот атрибут определяет значение пункта списка (select), которое будет отправлено на сервер. Отправляется пара «имя=значение», где имя задается параметром name тега <select>,а значение — параметром value выделенных пунктов списка.
Для тега param — значение параметра.
Для button value задает значение кнопки, которое будет отправлено на сервер или прочитано с помощью сприптов.
Для тега li это число, с которого будет начинаться нумерованный список.
| Тип значения | CDATA, NUMBER |
|---|---|
| Значение по умолчанию | Нет |
| Применим к: | |
| Аналог в CSS | нет |
Пример
<input type="text" value="строка, которая отправится на сервер" />
Твой код:
<html> <head> <title></title> <style type=»text/css»> <!— —> </style> </head> <body> <form action=»…»> <div> <input type=»text» name=»name» value=»Вася Пупкин» /><input type=»submit» value=»отправить на сервер» /> </div> </form> <ol > <li >строка</li> <li value=»3″>строка</li> <li>строка</li> </ol> </body> </html>Сделай код и жми тут
Результат:
большой полигонАтрибут value | htmlbook.ru
| Internet Explorer | Chrome | Opera | Safari | Firefox | Android | iOS |
| 4.0+ | 1.0+ | 4.0+ | 1.0+ | 1.0+ | 1.0+ | 1.0+ |
Спецификация
| HTML: | 3.2 | 4.01 | 5.0 | XHTML: | 1.0 | 1.1 |
Описание
Определяет значение пункта списка, которое будет отправлено на сервер. На сервер отправляется пара «имя=значение», где имя задается атрибутом name тега <select>, а значение — атрибутом value выделенных пунктов списка. Значение может как совпадать с текстом пункта, так быть и самостоятельным. Также атрибут value применяется для получения значений данных через скрипты.
Синтаксис
<option value="значение">...</option>Значения
Любая текстовая строка заключенная в двойные или одинарные кавычки.
Значение по умолчанию
Нет.
Пример
HTML5IECrOpSaFx
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Тег OPTION, атрибут value</title>
<script>
function dataSelect(f) {
n = f.hero.selectedIndex
if(n) alert("Выбран герой: " + f.hero.options[n].value)
}
</script>
</head>
<body>
<form action="option1.php">
<p><select name="hero">
<option>Выберите героя</option>
<option value="Чебурашка">Чебурашка</option>
<option value="Крокодил Гена">Крокодил Гена</option>
<option value="Шапокляк">Шапокляк</option>
<option value="Крыса Лариса">Крыса Лариса</option>
</select>
<input type="button" value="OK"></p>
</form>
</body>
</html>Атрибут value тега | HTML справочник
HTML тег <option>Значение и применение
Атрибут value (HTML тега <option>) указывает значение, которое будет отправлено на сервер при отправке формы.
Если значение атрибута не указано, то в качестве значения будет выступать содержимое элемента <option>.
Поддержка браузерами
Синтаксис:
<option value>
Отличия HTML 4.01 от HTML 5
Нет.Пример использования
<!DOCTYPE html> <html> <head> <title>Пример использования атрибута value HTML тега <option></title> </head> <body> <form action = "#"> <!--Адрес передачи данных при отправке формы (относительный, либо абсолютный URL)--> <select> <option value = "A">Option A</option> <option value = "B">Option B</option> <option value = "C">Option C</option> </select> <input type = "submit" value = "отправить"> </form> </body> </html>
В браузере это выглядит следующим образом:
Пример использования атрибута value HTML тега <option> (значение, которое будет отправлено на сервер, когда форма отправляется).Давайте рассмотрим пример в котором используются раскрывающийся список (<select>) и список предопределенных вариантов для ввода (<datalist>).
Элементом списков выступает тег <option>. Если в списках используется атрибут label, то текст надписи, которая указывает значение параметра берется из него. Если значение атрибута label не указано, то этим значением выступает содержимое элемента <option>, при этом необходимо использовать закрывающий элемент </option>.
Обращаю Ваше внимание, что если в списке предопределённых вариантов (<datalist>) используется атрибут value, то поиск осуществляется по нему, если атрибут отсутствует, то по содержимому элемента, при этом необходимо использовать закрывающий элемент </option>.
<!DOCTYPE html> <html> <head> <title>Пример использования атрибута label HTML тега <option></title> </head> <body> <form action = "#"> <!--Адрес передачи данных при отправке формы (относительный, либо абсолютный URL)--> <fieldset> <!--Группируем элементы формы--> <legend>Составление маршрута</legend> <!--Заголовок для элемента <fieldset> --> Город отправления: <select> <!--Раскрывающийся список--> <option label = "Владивосток"> <option label = "Анапа"> <option label = "Москва"> <option label = "Смоленск"> <option label = "Якутск"> </select> <p>Аэропорт назначения: <input type = "text" list = "airports"> </p> <datalist id = "airports"> <!--Список предопределенных вариантов для ввода--> <option value = "VVO" label = "Владивосток"> <option value = "MEM" label = "Анапа"> <option value = "VKO" label = "Москва Внуково"> <option value = "LNX" label = "Смоленск"> <option value = "YKS" label = "Якутск"> </datalist> <input type = "submit" value = "подтвердить"> </fieldset> </form> </body> </html>
В браузере это выглядит следующим образом:
Пример использования атрибута label HTML тега <option> (текст надписи, которая указывает значение параметра).HTML тег <option>HTML атрибут value | назначение, значения, примеры
Атрибут value — задает начальное значение для элемента.
Для input — это значение элемента формы, которое будет отправлено на сервер или получено с помощью клиентских скриптов.
На сервер отправляется пара «имя=значение», где имя задается параметром name тега input, а значение — параметром value.
Параметр value для кнопок (type=submit|reset|button) устанавливает текстовую надпись на них. Для текстовых полей (type=»text|file») указывает предварительно введенную строку. Для флажков и переключателей (type=checkbox|radio) уникально определяет каждый элемент.
Для тега option этот атрибут определяет значение пункта списка (select), которое будет отправлено на сервер. Отправляется пара «имя=значение», где имя задается параметром name тега <select>,а значение — параметром value выделенных пунктов списка.
Для тега param — значение параметра.
Для button value задает значение кнопки, которое будет отправлено на сервер или прочитано с помощью сприптов.
Для тега li это число, с которого будет начинаться нумерованный список.
| Тип значения | CDATA, NUMBER |
|---|---|
| Значение по умолчанию | Нет |
| Применим к: | |
| Аналог в CSS | нет |
Пример
<input type="text" value="строка, которая отправится на сервер" />
Твой код:
<html> <head> <title></title> <style type=»text/css»> <!— —> </style> </head> <body> <form action=»…»> <div> <input type=»text» name=»name» value=»Вася Пупкин» /><input type=»submit» value=»отправить на сервер» /> </div> </form> <ol > <li >строка</li> <li value=»3″>строка</li> <li>строка</li> </ol> </body> </html>Сделай код и жми тутРезультат:
большой полигонHTML атрибут value | назначение, значения, примеры
Последнее обновление: 03.02.2011
Атрибут value — задает начальное значение для элемента.
Для input — это значение элемента формы, которое будет отправлено на сервер или получено с помощью клиентских скриптов.
На сервер отправляется пара «имя=значение», где имя задается параметром name тега input, а значение — параметром value.
Параметр value для кнопок (type=submit|reset|button) устанавливает текстовую надпись на них. Для текстовых полей (type=»text|file») указывает предварительно введенную строку. Для флажков и переключателей (type=checkbox|radio) уникально определяет каждый элемент.
Для тега option этот атрибут определяет значение пункта списка (select), которое будет отправлено на сервер. Отправляется пара «имя=значение», где имя задается параметром name тега <select>,а значение — параметром value выделенных пунктов списка.
Для тега param — значение параметра.
Для button value задает значение кнопки, которое будет отправлено на сервер или прочитано с помощью сприптов.
Для тега li это число, с которого будет начинаться нумерованный список.
| Тип значения | CDATA, NUMBER |
|---|---|
| Значение по умолчанию | Нет |
| Применим к: | |
| Аналог в CSS | нет |
Пример
<input type="text" value="строка, которая отправится на сервер" />
Твой код:
<html> <head> <title></title> <style type=»text/css»> <!— —> </style> </head> <body> <form action=»…»> <div> <input type=»text» name=»name» value=»Вася Пупкин» /><input type=»submit» value=»отправить на сервер» /> </div> </form> <ol > <li >строка</li> <li value=»3″>строка</li> <li>строка</li> </ol> </body> </html>Сделай код и жми тутРезультат:
большой полигонЗаметки
По теме: