output

提供: ASCII.jp HTMLリファレンス

ver.未対応~ ver.7~ ver.14~ ver.5.1~ ver.11.5~
意味 計算結果の表示
読み方 アウトプット

カテゴリー

フロー・コンテンツ
フレージング・コンテンツ
リスト化/ラベル付け可能/リセット可能なフォーム関連要素

親にできる要素/カテゴリー

フレージング・コンテンツが期待される場所

子にできる要素/カテゴリー

フレージング・コンテンツ

<output 属性="値">~</output>

属性 概要
name 文字列 フィールドの名前
for 文字列 関連する要素のID
form 文字列 所属先フォームを明示

グローバル属性

accesskey,class,contenteditable,contextmenu,dir,draggable,hidden,id,lang,spellcheck,style,tabindex,title

説明

 output要素は、計算結果を表示します。

 フォームで入力された値に基づいて計算をして、その結果を表示するようなときに使います。フォーム関連の要素ではありますが、ユーザーからの入力を受け付ける要素ではありません。

 for属性では、計算の元になる値が入っている要素のIDを指定できます。

 form属性では、所属先のフォームの名前を明示できます。

 Internet Explorer 8/9ではoutput要素は実装されていません。

サンプル

(body要素の内部のみ掲載)

<form action="server.php" method="post" oninput="result.value = Number(num1.value) + Number(num2.value);">
<p><label>数1:<input type="text" name="num1"></label></p>
<p><label>数2:<input type="text" name="num2"></label></p>
<p><label>結果:<output name="result"></output></label></p>
</form>

サンプル実行画像

 フォームに数値を入力して、計算結果を表示しようとしたところです。Internet Exlorer 9ではoutput要素が実装されていないので、結果は表示されません。

 Firefox 7での表示例です。数値を変更するたびに計算結果が表示されます。

Powered by Web Professional

目次