Skip to content

Commit

Permalink
2024/11/02 時点の英語版に基づき更新
Browse files Browse the repository at this point in the history
  • Loading branch information
mfuji09 committed Nov 10, 2024
1 parent ae76d18 commit b17c69d
Showing 1 changed file with 30 additions and 27 deletions.
57 changes: 30 additions & 27 deletions files/ja/web/html/element/textarea/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
title: "<textarea>: テキストエリア要素"
slug: Web/HTML/Element/textarea
l10n:
sourceCommit: 0f4b28bdc51e89cd25d132b9db12e3e903a9c5aa
sourceCommit: 709d3a56661f895e5b0a67ff969e381d503ddd45
---

{{HTMLSidebar}}
Expand All @@ -16,69 +16,72 @@ l10n:
- `id` 属性により、アクセシビリティのために `<textarea>` を {{htmlelement("label")}} 要素に結びつけることができる
- `name` 属性により、フォームが送信されたときにデータポイントに関連付けられた名前を設定している
- `rows` 属性と `cols` 属性により、`<textarea>` が占める実際の大きさを指定することができます。ブラウザーの既定値が様々である可能性があるため、一貫性のためにこれらの値を設定することはよいことでしょう。
- 既定のコンテンツが開始タグと終了タグの間に入っています。`<textarea>``value` 属性に対応していません。
- `<textarea>` 要素は、 HTML と JavaScript のコンテキストとでは、コンテンツの指定方法が異なります。
- HTML では、 `<textarea>` の初期コンテンツは開始タグと終了タグの間で指定され、 `value` 属性としては指定されません。
- JavaScriptでは、`<textarea>` 要素には現在のコンテンツを取得または設定するために使用できる [`value`](/ja/docs/Web/API/HTMLTextAreaElement/value) プロパティと、初期値を取得または設定する [`defaultValue`](/ja/docs/Web/API/HTMLTextAreaElement/defaultValue) があります(HTML 要素のテキストコンテンツにアクセスするのと同等の機能です)。

`<textarea>` 要素は他にも、フォームの `<input>` と共通の属性のいくつか、例えば `autocapitalize`, `autocomplete`, `autofocus`, `disabled`, `placeholder`, `readonly`, `required` などを受け付けます
`<textarea>` 要素は他にも、フォームの `<input>` と共通の属性のいくつか、例えば `autocapitalize`, `autocomplete`, `autofocus`, `disabled`, `placeholder`, `readonly`, `required` などを受け入れます

## 属性

この要素には[グローバル属性](/ja/docs/Web/HTML/Global_attributes)があります。

- `autocapitalize`
- [`autocapitalize`](/ja/docs/Web/HTML/Global_attributes/autocapitalize)

- : 入力されたテキストを自動的に大文字にするかどうか、大文字にする場合はその方法を制御します。詳しい情報はグローバル属性 [`autocapitalize`](/ja/docs/Web/HTML/Global_attributes/autocapitalize) のページを参照してください。
- : 入力されたテキストを自動的に大文字にするかどうか、大文字にする場合はその方法を制御します。

- `autocomplete`
- [`autocomplete`](/ja/docs/Web/HTML/Attributes/autocomplete)

- : この属性は、コントロールの値をブラウザーが自動的に補完してよいかを示します。以下の値を指定できます。
- : この属性は、コントロールの値をブラウザーが自動的に入力してよいかを示します。以下の値を指定できます。

- `off`: ユーザーはフォームを使用するたびにフィールドへ値を明示的に入力しなければならないか、ドキュメントが独自の自動補完を提供します。ブラウザーは入力内容の自動補完を行いません。
- `on`: ブラウザーはユーザーが以前入力した値を元に、値の自動補完を行うことができます。
- `off`: ユーザーはフォームを使用するたびにフィールドへ値を明示的に入力しなければならないか、ドキュメントが独自の自動入力を提供します。ブラウザーは入力内容の自動入力を行いません。
- `on`: ブラウザーはユーザーが以前入力した値を元に、値の自動入力を行うことができます。
- [`<token-list>`](/ja/docs/Web/HTML/Attributes/autocomplete#トークンリストのトークン): 自動入力の詳細トークンを順序付きで空白区切りした集合です。オプションでグループ名トークン、配送先または請求先を表すグループ化トークン、連絡先の種類を識別するためのトークンなどがその前に入ります。

`autocomplete` 属性を `<textarea>` 要素に指定していない場合、ブラウザーは `<textarea>` 要素のフォームオーナーの `autocomplete` 属性の値を使用します。フォームオーナーは当該 `<textarea>` 要素が子孫になっている {{HTMLElement("form")}} 要素か、textarea 要素の `form` 属性で `id` を指定されている form 要素です。詳しくは、{{HTMLElement("form")}} 要素の [`autocomplete`](/ja/docs/Web/HTML/Element/form#autocomplete) 属性をご覧ください。
`<textarea>` 要素に `autocomplete` 属性を指定していない場合、ブラウザーはその `<textarea>` 要素のフォームオーナーに設定された `autocomplete` `on` または `off` の状態を継承します。フォームオーナーは当該 `<textarea>` 要素が子孫になっている {{HTMLElement("form")}} 要素か、その入力フィールドの `form` 属性で `id` を指定されている form 要素です。詳しくは、{{HTMLElement("form")}} 要素の [`autocomplete`](/ja/docs/Web/HTML/Element/form#autocomplete) 属性をご覧ください。

- `autocorrect` {{non-standard_inline}}
- [`autocorrect`](/ja/docs/Web/HTML/Global_attributes/autocorrect)

- : 文字列で、ユーザーがこの `textarea` を編集しているときに、自動スペルチェックとテキスト置換(設定されている場合)の処理を有効にするかどうかを指定します。許可されている値は以下の通りです。
- : ユーザーがこの `textarea` を編集しているときに、テキストの自動スペルチェックと修正を有効にするかどうかを制御します。
許可されている値は以下の通りです。

- `on`
- : 自動スペルチェックとテキスト置換を有効にする。
- `off`
- : 自動スペルチェックと文字列置換を無効にする。

- `autofocus`
- [`autofocus`](/ja/docs/Web/HTML/Global_attributes/autofocus)
- : この論理属性で、ページ読み込み時にフォームコントロールがフォーカスを持つべきであることを指定できます。文書内でこの属性を指定することができる要素は、フォーム関連要素のうちのひとつだけです。
- `cols`
- : 平均的な文字幅による、テキストコントロールの外見上の幅です。この属性を指定する場合は、正の整数を与えなければなりません。指定されなかった場合の既定値は `20` です。
- `dirname`

- : この属性は `<input>` 要素の [`dirname`](/ja/docs/Web/HTML/Element/input#dirname) 属性と同様に、要素の内容のテキストの書字方向を示すために使用します。
- [`dirname`](/ja/docs/Web/HTML/Attributes/dirname)
- : この属性は、要素の内容のテキストの書字方向を示すために使用します。
詳しくは、 [`dirname` 属性](/ja/docs/Web/HTML/Attributes/dirname)を参照してください。

- `disabled`
- : この真偽値属性は、ユーザーがそのコントロールを利用できないことを示します。(もしこの属性が指定されていない場合、コントロールはその設定を親要素、例えば {{ HTMLElement("fieldset") }} 要素から継承します。もし親要素に `disabled` 属性を持つものがなければ、そのコントロールは利用可能です。)
- [`disabled`](/ja/docs/Web/HTML/Attributes/disabled)
- : この論理属性は、ユーザーがそのコントロールを利用できないことを示します。(もしこの属性が指定されていない場合、コントロールはその設定を親要素、例えば {{ HTMLElement("fieldset") }} 要素から継承します。もし親要素に `disabled` 属性を持つものがなければ、そのコントロールは利用可能です。)
- `form`
- : `<textarea>` 要素が関連づけられた form 要素 (フォームオーナー) です。属性値は、同じドキュメント内の form 要素の id としなければなりません。この属性を指定しない場合は、`<textarea>` 要素を form 要素の子要素として配置しなければなりません。この属性により、`<textarea>` 要素を form 要素の子孫としてだけではなく、同一文書のどこにでも配置できるようになりました。
- `maxlength`
- [`maxlength`](/ja/docs/Web/HTML/Attributes/maxlength)
- : ユーザーが入力可能な文字 (UTF-16 コード単位) の最大数です。この属性を指定しない場合、ユーザーは無制限に文字を入力可能です。
- `minlength`
- [`minlength`](/ja/docs/Web/HTML/Attributes/minlength)
- : ユーザーが入力しなければならない最小文字数 (UTF-16 コード単位) です。
- `name`
- : コントロールの名前です。
- `placeholder`
- [`placeholder`](/ja/docs/Web/HTML/Attributes/placeholder)

- : コントロールに何を入力できるかに関する、ユーザーへの助言です。プレースホルダーのテキスト内にあるキャリッジリターンやラインフィードは、ヒントを表示する際に改行として扱わなければなりません。

> [!NOTE]
> プレースホルダーはフォームに入力されるべきデータの種類の例を示すためだけに使用してください。入力欄に関連付けられた {{HTMLElement("label")}} 要素の代わりとして使用*しない*でください。全体的な説明は、[`<input>` ラベル](/ja/docs/Web/HTML/Element/input#%E3%83%A9%E3%83%99%E3%83%AB)を参照してください。
> プレースホルダーはフォームに入力されるべきデータの種類の例を示すためだけに使用してください。入力欄に関連付けられた {{HTMLElement("label")}} 要素の代わりとして使用*しない*でください。全体的な説明は、[`<input>` ラベル](/ja/docs/Web/HTML/Element/input#ラベル)を参照してください。
- `readonly`
- [`readonly`](/ja/docs/Web/HTML/Attributes/readonly)
- : これは論理属性で、ユーザーがコントロールの値を変更できないことを示します。`disabled` 属性とは異なり、`readonly` 属性はユーザーがコントロールをクリックしたり選択することを妨げません。読み取り専用のコントロールの値は、フォームとともに送信可能です。
- `required`
- [`required`](/ja/docs/Web/HTML/Attributes/required)
- : この属性は、フォームを送信する前に値を入力しなければならないことを示します。
- `rows`
- : コントロールで見ることが可能なテキストの行数です。指定する場合は、正の整数でなければなりません。指定されなかった場合、既定値は 2 になります。
- `spellcheck`
- [`spellcheck`](/ja/docs/Web/HTML/Global_attributes/spellcheck)

- : `<textarea>` がブラウザーや OS に依存したスペルチェックを行うかどうかを指定します。以下の値が使用できます。

Expand All @@ -104,7 +107,7 @@ l10n:

### ベースラインの不整合

HTML 仕様書では、 `<textarea>` のベースラインがどこであるかを定義していません。よって、ブラウザーによりその位置は異なります。 Gecko では `<textarea>` のベースラインを textarea の最初の行のベースラインに設定しています。他のブラウザーは、`<textarea>` のボックスの下端に設定していることもあります。動作を予測できないため、 {{cssxref("vertical-align")}}`: baseline` を使用しないようにしてください。
HTML 仕様書では、 `<textarea>` のベースラインがどこであるかを定義していません。よって、ブラウザーによりその位置は異なります。 Gecko では `<textarea>` のベースラインを textarea の最初の行のベースラインに設定しています。他のブラウザーは、`<textarea>` のボックスの下端に設定していることもあります。動作を予測できないため、 {{cssxref("vertical-align", "vertical-align: baseline")}} を使用しないようにしてください。

### テキストエリアの大きさの変更が可能かどうかの制御

Expand Down Expand Up @@ -225,7 +228,7 @@ textarea {

#### 結果

{{EmbedLiveSample('disabled_and_readonly_textareas', '', '230')}}
{{EmbedLiveSample('disabled_and_readonly_text_areas', '', '230')}}

## 技術的概要

Expand Down

0 comments on commit b17c69d

Please sign in to comment.