value 属性入力コントロールの初期値を指定する

input 要素における value 属性

value 属性はフォームの入力コントロールにおける初期値を指定します。フォームが送信される際、input 要素の type 属性値が、hidden の場合や、text などが指定され、閲覧者が値を入力できるコントロールの場合でも readonly 属性が指定されている場合は、この値がそのまま送信されます。

閲覧者が初期値を変更した場合は、変更後の値がフォーム送信時に送られます。

input 要素の type 属性値が check、または radio の場合、選択された要素に指定された、この属性値の値が送信されます。指定されていない場合は、空の値が送信されます。

option 要素などでは、value 属性が指定されない場合、option 要素の内容となるテキストが値として送信されますが、option 要素の内容と、実際に送信する値を違う値にしたい場合は、value 属性によって指定することができます。

input type="submit"input type="reset"button 要素などでは、value 属性値が、ボタンのラベルとして利用されます。

従来の HTML では、input type="text" の value 属性値に、入力例などを入れて、プレースホルダとして利用する場合がありましたが、HTML5 では、placeholder 属性が追加されたため、このような用途には placeholder 属性が利用できます。

li 要素における value 属性

li 要素ol 要素の子要素として使用される場合のみ、value 属性によってリストマーカーに表示する数字を指定することができます。指定できる値は、算用数字 (1, 2 ...など) による整数でなければなりません。

meter 要素における value 属性

meter 要素における value 属性は、現在の数値を指定します。指定できる数値は浮動小数点数ですが、max 属性値以下、min 属性値以上でなければなりません。

data 要素における value 属性

data 要素において、value 属性は必須で、その値はマシンリーダブル (プログラムなどによって読み取り可能な) な形式でなければなりません。

サンプルソースを見る

value 属性の仕様

この属性を使用できる要素

value 属性のサンプルソース

<form method="get" action="/search" role="search">
 <fieldset>
  <legend accesskey="s">サイト内検索</legend>
  <input type="search" name="search" value="" placeholder="検索ワードを入力" />
  <input type="submit" name="submit" value="検索" />
 </fieldset>
</form>
<h1>好きな要素トップ 10 ランキング</h1>
<ol>
 <li value="10">menu 要素</li>
 <li value="9">hgroup 要素</li>
 <li value="8">form 要素</li>
 <li value="7">hr 要素</li>
 <li value="6">img 要素</li>
 <li value="5">main 要素</li>
 <li value="4">h1 要素</li>
 <li value="3">section 要素</li>
 <li value="2">article 要素</li>
 <li value="1">a 要素</li>
</ol>
<p>
  このビルは<data value="14">十四</data>階建てです。
  弊社はその<data value="8">八</data>階にオフィスを開設しています。
</p>