フォーム

`<output>` 計算結果の表示

重要度1 / 5

意味

入力した値をもとに計算した結果を表示する場合に使います。for 属性に、計算に使う入力欄の id を書きます。

コード

HTML

<form oninput="total.value = Number(pages.value) * 8000">
  <label for="pages">ページ数</label>
  <input id="pages" type="number" value="6" min="1">
  合計：<output name="total" for="pages">48000</output>円
</form>

プレビュー（初期表示）

ブラウザ対応

主要ブラウザの対応状況
ブラウザ	対応
Chrome	10〜
Firefox	4〜
Safari	7〜
Edge	≤18〜
Chrome Android	18〜
Safari iOS	7〜

出典: MDN Web Docs（`@mdn/browser-compat-data`）