output
<output> 要素は計算結果を表示するときに使用します。
- 分類
- フローコンテンツ、フレージングコンテンツ、フォーム関連要素(リスト化、ラベル付け可能、リセット可能)、知覚可能コンテンツ
- 内包できるもの
- フレージングコンテンツ
属性
部品と関連付ける
for=”” 属性は計算の対象となるフォーム部品を指定します。各部品に指定された id=”” の値を半角スペースで区切り for=”” の値として指定します。
<form id="form01">
<input type="range" id="a" name="a" value="50" /> ×
<input type="range" id="b" name="b" value="50" /> =
</form>
<output name="result" form="name01" for="a b"></output>
フォームと関連付ける
form=”” 属性はどの <form> 要素に関連付けるかを指定します。<form> 要素に指定した id=”” の値を指定します。
<form id="name01">
<input type="range" id="a" name="a" value="50" /> ×
<input type="range" id="b" name="b" value="50" /> =
</form>
<output name="result" form="name01" for="a b"></output>
要素の名前
name=”” 属性は出力欄を識別するための名前を指定します。
<form id="name01">
<input type="range" id="a" name="a" value="50" /> ×
<input type="range" id="b" name="b" value="50" /> =
</form>
<output name="result" form="name01" for="a b"></output>
サンプル
<form oninput="result.value=parseInt(a.value)*parseInt(b.value)">
<input type="range" id="a" name="a" value="50" /> ×
<input type="range" id="b" name="b" value="50" /> =
<output name="result" for="a b"></output>
</form>