for属性

output要素のfor属性は、計算結果と、計算に用いた値を持つ要素を、明示的に関連付ける属性。

ブラウザ対応

構文

<output for="計算に使った要素のid属性値"></output>

計算に使った要素のid属性値

計算に用いた値を持つ要素のid属性値を指定する。半角スペース区切りで、複数指定できる。

要点

  • for属性は、計算結果と、計算に用いた値を持つ要素を、明示的に関連付ける属性である。
  • for属性を指定しなくても、output要素に計算結果を出力することはできる。
  • for属性は、HTML5にて新たに導入された属性である。

サンプルコード

<form oninput="calculationResult.value=parseInt(numA.value)*parseInt(numB.value)">
	<input type="number" id="numA">
	×
	<input type="number" id="numB">
	=
	<output name="calculationResult" for="numA numB"></output>
</form>

サンプル

HTMLソースコード

<form oninput="sampleResult.value=parseInt(sampleNumA.value)*parseInt(sampleNumB.value)">
	<p>
		<input type="number" id="sampleNumA" value="0">
		×
		<input type="number" id="sampleNumB" value="0">
		=
		<output name="sampleResult" for="sampleNumA sampleNumB"></output>
	</p>
</form>

実際の表示

×