<textarea> - フォーム部品：テキストエリア

• トップ
• HTMLリファレンス
• <textarea>

• 概要
• 説明
• 属性
  • 重要属性
  • 固有属性
  • データバインド関連
• 使用例
• 関連項目
• リンク

概要

形式

<textarea>～</textarea>

サポート

https://caniuse.com/mdn-html_elements_textarea

カテゴリ

フローコンテンツ

フレージングコンテンツ

インタラクティブコンテンツ

リステッド, ラベラブル, サブミッタブル, リセッタブル, リアソシエイタブル(HTML 5.2), フォーム関連要素

パルパブルコンテンツ

親要素

フレージングコンテンツ を子要素に持てるもの

子要素

テキスト

タグの省略

開始タグ:必須 / 終了タグ:必須

属性

グローバル属性

autocomplete

cols

dirname

disabled

form

maxlength

minlength

name

placeholder

readonly

required

rows

wrap

説明

複数行入力可能な入力フォームを表示します。<textarea>～</textarea> の間に記述したテキストが初期値として表示されます。

属性

重要属性

グローバル属性

詳細は グローバル属性 を参照してください。

name=name

LS/H2/e2/Ch/Fx/Sa/Op/N2

名前を指定します。

cols=n

LS/H2/e2/Ch/Fx/Sa/Op/N2/i1

テキストエリアの横幅を指定します。HTML4.01では必須の属性として定義されています。

rows=n

LS/H2/e2/Ch/Fx/Sa/Op/N2/i1

テキストエリアの縦幅(行数)を指定します。HTML4.01では必須の属性として定義されています。

固有属性

autocomplete=value

LS/H5/e6/Fx/Ch/Sa/Op

オートコンプリートの有効・無効などを指定します。省略時は form 要素の値に従います。

on

有効にする(デフォルト)

off

無効にする

HTML5 や HTML Living Standard では、on/off 以外にも様々な指定が可能ですが、説明は省略します。詳細は MDN(↗) を参照してください。

dirname=name

LS/H5/Ch/Op

部品に入力されたテキストの方向(ltr,rtl)を、nameで指定されたパラメータの値としてサーバに送信します。

disabled

LS/H4/e4/Ch/Fx/Sa/Op/N6

テキストフィールドへの入力をできなくします。表示文字は灰色で表示されます。

form=id

LS/H5/Ch/Fx/Sa/Op

関連付けたい form要素のidを指定します。

inputmode=mode

LS/H5

入力モードを指定します。

maxlength=n

LS/H5

最大文字数を指定します。

minlength=n

LS/H5

最小文字数を指定します。

placeholder=string

LS/H5

プレースホルダを指定します。

readonly

LS/H4/e4/Ch/Fx/Sa/Op/N6

テキストフィールドへの入力をできなくします。

required

LS/H5

この入力項目が必須であることを示します。

wrap=wrap

LS/H5/e3/N2

入力文字数が横幅を超える場合の自動改行を指定します。

off

自動改行しない(e4/Ch/Fx/Sa/Op/N2)

hard

表示も送信も自動改行される(H5/e3/Ch/Sa/Op/N2)

soft

表示は自動改行されるが送信は自動改行されない(H5/e3/Ch/Fx/Sa/Op/N2)

physical

hardと同じ(e?/N?)

virtual

softと同じ(e?/N?)

align=align

[非推奨] e4

テキストエリアを表示する位置を指定します。Microsoftのドキュメントには記述されていますが、実装はされていないようです。

istyle=n

[非推奨] i2

入力モードの初期値を指定する。<input>を参照。

データバインド関連

datafld=datafld

[非推奨] e4

データバインド機能を用いる際の、データソースの列名を指定します。

datasrc=datasrc

[非推奨] e4

データバインド機能を用いる際の、データソースの ID を指定します。

使用例

<form method="POST" action="sample.cgi">
 <div>
  <textarea name="msg" cols=40 rows=4>あいうえお</textarea>
 </div>
 <input type="submit" value="送信">
</form>

関連項目

• <form>
• <input>
• <select>

リンク

• https://html.spec.whatwg.org/multipage/form-elements.html#the-textarea-element
• https://developer.mozilla.org/ja/docs/Web/HTML/Element/textarea
• https://caniuse.com/mdn-html_elements_textarea