<TEXTAREA>NN すべて IE すべて HTML すべて  

<TEXTAREA>...</TEXTAREA>

HTML 終了タグ : 必要  

textarea 要素は、主に form 要素内で使用される複数行テキスト入力コントロールです。Navigator 4 かそれ以前のバージョンで必要になります。テキストタイプ input 要素とは異なり、textarea 要素は複数行のテキストを挿入するためにサイズを調節できます。最近のブラウザでは行の折り返しもでき、またユーザーはテキストボックス内で改行文字 (CRLF) を使用できます。送信されたフォーム内に textarea 要素がある場合、テキストボックスのコンテンツである値と共に「名前/値」のペアが送信されます。name 属性を指定する必要があります。サーバーの CGI プログラムは、テキストデータ内の改行を処理できる必要があります。

読み込み時に textarea 要素内にテキストを表示する場合、そのテキストは開始タグと終了タグの間に表示されます。それ以外ではソースコードの開始タグと終了タグの間には何も文字は入りません。textarea 要素のラベルは、要素の前後に配置する必要があります。新しいブラウザではオプションとして、構造上 label 要素内に配置することもできます。

 
 
<TEXTAREA rows="5" cols="60" name="notes">Use this area for extra notes.
</TEXTAREA>
 
オブジェクト参照
 
[window.]document.formName.elementName
[window.]document.forms[i].elements[j]
[window.]document.getElementById(elementID)
 
要素固有の属性
 
colsdataflddatasrcdisabledname
readonlyrowswrap
 
要素固有のイベントハンドラー属性
 
ハンドラーNNIEHTML
onafterupdateなし4なし
onbeforeupdateなし4なし
onchange234
onscrollなし34
onselect234
accesskeyNN 6 (テキストを参照) IE 4/5 HTML 4 (テキストを参照)  

accesskey="character"

オプション  

要素にフォーカスを移動したり (一部のブラウザ)、フォームコントロールやリンクアクションをアクティブにしたりする単一の文字キー。リンクをアクティブにするためにアクセスキーと一緒に修飾キー (CtrlAlt、または Command) を押す必要があるかどうかは、使用するブラウザと OS によって決まります。Windows 版 IE 4 以降および Netscape 6 では、Alt キーを押す必要があり、文字キーの大文字と小文字は区別されません。Macintosh 版 IE 5 以降および Netscape 6 では、アクションを実行するには Ctrl キーを押す必要があります。

ここに示されている accesskey は広く使用されている共通属性ですが、すべての実装において厳密に共通というわけではありません。HTML 4 および Netscape 6 でこの属性が認識される要素は、aareabuttoninputlabellegend、および textarea だけです。IE 4 では、これに appletbodydivembedisindexmarqueeobjectselectspantable、および td が追加されています。ただし、label および legend は削除されました。IE 5 では、他のすべての表示可能な要素が追加されていますが、注意が必要です。input 要素とその他のフォーム関連要素の場合を除き、IE 5 以降ではアクセラレータキーの組み合わせで要素にフォーカスを移動するには、要素に tabindex 属性も (すべての値が 0 の場合でも) 指定する必要があります。

 
 
<A href="http://www.megacorp.com/toc.html" accesskey="t">Table of Contents</A>
		<H2 class="subsection" accesskey="2" tabindex="0">Part Two</H2>
 

ドキュメントセットの単一の文字

 
既定値

なし

 
オブジェクト参照
 
[window.]document.links[i].accessKey
		[window.]document.anchors[i].accessKey
		[window.]document.formName.elementName.accessKey
		[window.]document.forms[i].elements[j].accessKey
		[window.]document.getElementById(elementID).accessKey
colsNN すべて IE すべて HTML すべて  

cols="columnCount"

オプション  

textarea 要素の編集可能なスペースの幅。この値は、その幅に表示されるモノフォント数を示しています。スタイルシートのフォントサイズをサポートするブラウザでは、実際の幅はそれに従って変化します。

 
 
<TEXTAREA cols="40">...</TEXTAREA>
 

正の整数

 
既定値

ブラウザや OS によって異なります。

 
オブジェクト参照
 
[window.]document.formName.elementName.cols
[window.]document.forms[i].elements[j].cols
[window.]document.getElementById(elementID).cols
datafldNN なし IE 4 HTML なし  

datafld="columnName"

オプション  

IE のデータバインディングと共に使用して、リモートデータソースの列名を textarea 要素のコンテンツに関連付けます。この要素には datasrc 属性も設定する必要があります。Macintosh 版 IE 5 ではテキストファイルのデータソースに対してのみ機能します。

 
 
<TEXTAREA name="summary" datasrc="DBSRC3" datafld="summary"></TEXTAREA>
 

大文字と小文字を区別する識別子

 
既定値

なし

 
オブジェクト参照
 
[window.]document.formName.elementName.dataFld
[window.]document.forms[i].elements[j].dataFld
[window.]document.getElementById(elementID).dataFld
datasrcNN なし IE 4 HTML なし  

datasrc="dataSourceName"

オプション  

IE のデータバインディングと共に使用して、リモートデータアクセス用にデータソースオブジェクトを読み込むページの object 要素の ID を示します。データソースからのコンテンツは datafld 属性によって設定されます。Macintosh 版 IE 5 ではテキストファイルのデータソースに対してのみ機能します。

 
 
<TEXTAREA name="summary" datasrc="DBSRC3" datafld="summary"></TEXTAREA>
 

大文字と小文字を区別する識別子

 
既定値

なし

 
オブジェクト参照
 
[window.]document.formName.elementName.dataSrc
[window.]document.forms[i].elements[j].dataSrc
[window.]document.getElementById(elementID).dataSrc
disabledNN 6 IE 4 HTML 4  

disabled

オプション  

無効になった textarea 要素をユーザーがアクティブにすることはできません。Windows 版 IE および Netscape 6 では、無効になった textarea はフォーカスを受けることができず、タブ順序内でもアクティブになりません。無効になった要素の「名前/値」のペアは、フォームの送信時に送信されません。

disabled 属性はブール値であり、この属性があるとその値は true に設定されます。その値も後でスクリプトを使用して調整できます。詳細については、第 9 章の textarea オブジェクトを参照してください。

 
 
<TEXTAREA disabled></TEXTAREA>
 

この属性があると、この要素が無効になります。

 
既定値

false

 
オブジェクト参照
 
[window.]document.formName.elementName.disabled
[window.]document.forms[i].elements[j].disabled
[window.]document.getElementById(elementID).disabled
langNN 3 IE 4 HTML 4  

lang="languageCode"

オプション  

要素の属性値およびコンテンツに使用される言語。ブラウザはこの情報を使用して、合字 (特定のフォントでサポートされたり、書き言葉で必要になった場合)、疑問符、およびハイフネーションの処理などの詳細に関して、コンテンツの適切な表示を行います。その他のアプリケーションや検索エンジンでは、スペルチェック辞書の選択やインデックスの作成にこの情報を利用する場合があります。

 
 
<SPAN lang="de">Deutsche Bundesbahn</SPAN>
 

大文字と小文字を区別しない言語コード

 
既定値

ブラウザの既定値

 
オブジェクト参照
 
[window.]document.getElementById(elementID).lang
nameNN すべて IE すべて HTML すべて  

name="elementIdentifier"

オプション  

textarea 要素がサーバーに送信中のフォームの一部である場合、要素の値がフォームと共に送信されるように設定されている場合には name 属性が必要です。スクリプトされたフォーム要素の便宜上ドキュメント内にあるフォームでは、textarea 要素名は必要ありませんが、オブジェクトやそのプロパティまたはメソッドへのスクリプト参照を作成する上で名前があると便利です。新しい DOM では、スクリプトによる要素オブジェクトの参照を統一するために、同じ識別子を id 属性に指定することを推奨しています。

 
 
<TEXTAREA name="comments" id="comments"></TEXTAREA>
 

大文字と小文字を区別する識別子

 
既定値

なし

 
オブジェクト参照
 
[window.]document.formName.elementName.name
[window.]document.forms[i].elements[j].name
[window.]document.getElementById(elementID).name
readonlyNN 6 IE 4 HTML 4  

readonly

オプション  

readonly 属性があると、ユーザーはページ上の textarea 要素を編集することができません。ただし、スクリプトでコンテンツを変更することはできます。readonly とマークされた textarea は、タブ順序内でもフォーカスされません。ただし、Macintosh 版 IE ではフィールドにフォーカスできます。ユーザーは、読み取り専用 textarea でテキストを選択してコピーできます。

 
 
<TEXTAREA name="instructions" readonly></TEXTAREA>
 

この属性があると、属性値には true が設定されます。

 
既定値

false

 
オブジェクト参照
 
[window.]document.formName.elementName.readOnly
[window.]document.forms[i].elements[j].readOnly
[window.]document.getElementById(elementID).readOnly
rowsNN すべて IE すべて HTML すべて  

rows="rowCount"

オプション  

スクロールなしで表示されるテキストの行数に基づいた textarea 要素の高さ。この値は、スクロールバーがアクティブにならない高さに表示されるモノスペースフォント文字の行数を示します。スタイルシートのフォントサイズをサポートするブラウザでは、実際の幅はそれに従って変化します。

 
 
<TEXTAREA rows="5" cols="40"></TEXTAREA>
 

正の整数

 
既定値

ブラウザや OS によって異なります。

 
オブジェクト参照
 
[window.]document.formName.elementName.rows
[window.]document.forms[i].elements[j].rows
[window.]document.getElementById(elementID).rows
styleNN 4 IE 4 HTML 4  

style="styleSheetProperties"

オプション  

この属性を使用すると、現在の要素のスタイルシート規則プロパティ割り当てを設定できます。スタイル属性の割り当てには、CSS または JavaScript (Navigator 4 のみ) 構文を使用できます。style 属性は表示可能な要素についてのみ使用します。

 
 
<SPAN style="color:green; font-size:18px">Big, green, and bold</SPAN>
 

CSS 構文のスタイルシート規則全体は引用符によって囲まれます。複数のスタイル属性設定はセミコロンで区切られます。スタイルシート属性の詳細については、第 11 章を参照してください。

 
既定値

なし

 
オブジェクト参照
 
[window.]document.getElementById(elementID).style
tabindexNN 6 IE 4 HTML 4  

tabindex="integer"

オプション  

ドキュメント内にあるすべてのフォーカス可能な要素のタブ順序内で、この要素の順番を示す番号。タブ順序は一定の規則に従って決定されます。tabindex 属性にゼロ以外の値が指定された要素は、ユーザーがページでタブ操作を開始すると初めて表示されます。フォーカスは、tabindex の値が一番小さい要素から開始して、値の一番大きい要素まで順番に移動します。ページやドキュメント内での物理的な位置は関係ありません。tabindex の値が同じ要素が 2 つある場合、ドキュメント内で先頭に近い方の要素が最初にフォーカスを得ます。その次に、tabindex 属性をサポートしていない要素と値がゼロに設定されている要素のすべてにフォーカスします。これらの要素はドキュメント内の配置順にフォーカスを受けます。現在のページを再ロードした場合、タブシーケンスは必ずしも再び "最初" から始まるわけではありません。したがって、タブシーケンスの制御は、フォーカス可能な要素のロジックが、その要素のソースコードでの順序とは異なる場合に便利です。たとえば、テーブルの行方向ではなく、列の下方向のフィールドにタブで移動するような場合です。

HTML 4 および Netscape 6 では、tabindex 属性は aareabuttoninputobjectselecttextarea の各要素に限られています。IE 4 では、これに appletbodydivembedisindexmarqueespantable、および td が追加されます。IE 5 では、他のすべての表示可能な要素が追加されます。IE (のみ) で負の値を指定すると、要素がタブ順序から完全に削除されます。

Macintosh 版 の IE 4 では、リンクおよびアンカーにタブが移動されないので、要素の tabindex はこのバージョンでは無視されます。

 
 
<A href="chapter3.html" tabindex="3">Chapter 3</A>
 

0 から 32,767 までの整数。IE では tabindex に負の値を設定すると、その要素はタブ順序から完全にスキップされます。

 
既定値

なし

 
オブジェクト参照
 
[window.]document.getElementById(elementID).tabIndex
wrapNN 2 IE 4 HTML なし  

wrap="wrapType"

必要  

wrap 属性は、textarea 要素内でテキストを折り返すかどうか、また折り返されたテキストのソフトリターンをハードリターンに変換してサーバーに送信するかどうかをブラウザに伝えます。HTML 仕様ではこの件について規定されていませんが、Navigator や IE は、長年にわたって、いくつかの属性値を採用してきました。しかし、最近では、主なブラウザは offsofthard の 3 つの属性値をサポートしています。

soft に設定した場合、ユーザーがテキストを入力すると自動的に折り返されますが、フォームの送信時にテキストにキャリッジリターンおよびラインフィード (CRLF) は追加されません。hard に設定した場合、テキストの折り返しが行われ、折り返しによって挿入された CRLF は textarea の値の一部としてサーバーに送信されます。soft および hard と同じ意味で、以前は virtual および physical も使用されていました。off に設定した場合、領域の右端を越えて入力すると、textarea が横方向にスクロールされます。Return キーを押した場合にのみ、テキスト挿入ポインタが次の行に移動します。

 
 
<TEXTAREA name="comments" wrap="hard"></TEXTAREA>
 

定数値 : hard | off | soft

 
既定値

soft

 
オブジェクト参照
 
[window.]document.formName.elementName.wrap
[window.]document.forms[i].elements[j].wrap
[window.]document.getElementById(elementID).wrap