textarea要素

Updated / Published

textarea要素(multi-line text field)は複数行のテキスト入力欄を作成します。要素内のテキスト(テキストのみ内包可能)が初期値としてテキスト入力欄内に表示されます。データの送信は、入力した内容が値として送信されます。入力欄の行数を cols属性で、列数を rows属性で指定します。この2つの属性は必須です。なお、入力するデータ量が短く、テキスト入力欄が1行で済む場合は input要素type="text")を使います。

HTML4.01, XHTML1.0, XHTML1.1のtextarea要素には、input要素の maxlength属性が設けられていません。しかし、HTMLのフォームを拡張した仕様であるWeb Forms 2.0(2006年10月2日最終版)においてはtextarea要素にmaxlength属性が設けられ、このWeb Forms 2.0仕様がHTML5へと統合されたので、HTML5においてもmaxlength属性がtextarea要素に設けられています。最新のUAはすべてサポートしています。Internet ExplorerもIE9からはtextarea要素にmaxlength属性を記述することで文字数制限が可能ですが、IE6,7,8においてはサポートされていないため、textarea要素の領域を超える文字数を入力すると、スクロールを表示し、いくらでも入力することができます。IE6,7,8において最大入力文字数を機能的に設けるには、onkeydownなどのイベント属性を組み合わせたクライアントサイド・スクリプトで制限することが可能です。ただし環境設定で無効にされているなどのスクリプトが利用できない環境ではこれも無効であるため、正確に文字数制限を設けたい場合は、すべてのUAにおいても言えることですがCGIプログラムによるサーバサイド側で最大文字数を設定するようにした方が安全です。

バージョン
  • HTML4.01(S,T,F)
  • XHTML1.0(S,T,F)
  • XHTML1.1
要素型
インライン要素
開始タグ
必須
終了タグ
なし
非推奨
-
内容モデル
テキスト

cols属性

バージョン
  • HTML4.01(S,T,F)
  • XHTML1.0(S,T,F)
  • XHTML1.1
指定要素
textarea
必須
必須属性
非推奨
-
属性値
整数(pixels)

テキスト入力欄の横幅を指定します。この横幅は1行に入力できる文字数分の表示幅です。入力可能な文字数の幅を制限するものではありません。UA によって表示は異なりますが、大半の視覚環境の UA は半角スペースを含まない半角文字の入力が続くと、横幅にあわせて内容が自動的に折り返されることはなく、領域からはみ出してテキスト入力欄の下に横スクロールバーを表示します。全角文字や半角スペースが含まれると cols属性で指定されたテキスト入力欄の横幅にあわせて自動的に折り返しが行われます。

HTML5では、cols属性にデフォルト値(省略されている場合はcols="20"が指定されているとみなされる)が定義されているので必須属性ではなくなりました。

disabled属性

バージョン
  • HTML4.01(S,T,F)
  • XHTML1.0(S,T,F)
  • XHTML1.1
指定要素
必須
-
非推奨
-
属性値
  • disabled
  • disabled="disabled"(XHTML

テキスト入力欄の使用と選択を全て禁止します。使用が禁止されたテキスト入力欄の値は、送信されません。HTML4.01 では disabled、XHTML では属性値を省略できないため disabled="disabled" と記述します。

name属性

バージョン
  • HTML4.01(S,T,F)
  • XHTML1.0(S,T,F)
  • XHTML1.1
指定要素
textarea
必須
-
非推奨
-
属性値
文字列

テキスト入力欄に名前を付けます。データを送信する時に name属性の値とテキスト入力欄に入力されたテキストがセットになるので、どの項目に対する回答なのかがわかるように name属性の値で質問の内容を示しておきます。name属性の値は半角アルファベットの大文字・小文字が区別されません(case-insensitive)。

readonly属性

バージョン
  • HTML4.01(S,T,F)
  • XHTML1.0(S,T,F)
  • XHTML1.1
指定要素
必須
-
非推奨
-
属性値
  • readonly
  • readonly="readonly"(XHTML

テキスト入力欄を読み取り専用にして、ユーザ側でのデータの入力と変更を禁止します。値の入力と変更を禁止するもので、disabled属性とは違い、制作者側であらかじめ設定していた値は送信されます。HTML4.01 では readonly、XHTML では属性値を省略できないので readonly="readonly" と記述します。

rows属性

バージョン
  • HTML4.01(S,T,F)
  • XHTML1.0(S,T,F)
  • XHTML1.1
指定要素
textarea
必須
必須属性
非推奨
-
属性値
整数(pixels)

テキスト入力欄の高さとなる表示可能な行数を指定します。実際に入力可能な行数を制限するものではありません。指定された入力可能行数を超えた場合は、テキスト入欄の横に縦スクロールバーを表示して、いくらでも入力することができます。

HTML5では、rows属性にデフォルト値(省略されている場合はrows="2"が指定されているとみなされる)が定義されているので必須属性ではなくなりました。

wrap属性

バージョン
ブラウザの独自機能
指定要素
textarea
必須
-
非推奨
-
属性値
  • off
  • soft
  • hard

複数行のテキスト入力欄で文字数が指定された横幅を越える場合にテキストの折り返しを指定します。仕様として正式に定義されている機能ではなくブラウザの独自機能ですが、主要ブラウザはすべて対応しています。テキスト入力欄に入力された内容は、ユーザがテキストの入力途中に折り返す指定をしない限り、送信後のデータに折り返しが反映されることはありません。wrap属性を指定することで、入力欄の表示域にあわせた文字列の折り返しを指定することができます。値には次の3種類のキーワードがあります。キーワードは半角アルファベットの大文字・小文字が区別されません(case-insensitive)。

off
折り返しなし、実際に入力欄で折り返されたものも除いて送信
soft
自動的に折り返す、実際に折り返されたもののみ送信
hard
自動的に折り返す、実際に折り返されたものと自動的に折り返された両方を含んで送信

なお、折り返しと改行は混同される場合が多いですが、全く異なるものです。折り返し(\n)とはあくまでもソースコード内における改行であって、実際に画面上に改行(<br>)として表示に反映されることはありません。サーバサイドのCGIスクリプトでは、折り返しを示す "\n" があれば、デコード(CGI が受け取る形に変換されたデータを元の形に戻すこと)の際に "\n" を強制改行を示す br要素に変換するプログラムが書かかれているので、自動的に折り返しが改行コードに代わって表示にも反映されています。

なお、HTML5では、wrap属性が正式仕様として公認されました。

その他の属性

共通属性
イベント属性