HTMLTextAreaElement - HTMLのtextarea要素
公開日:
HTMLTextAreaElementは、HTMLのtextarea要素が実装するインターフェイスです。
概要
- 名前
- HTMLTextAreaElement
- 継承
- EventTarget
- Node
- Element
- HTMLElement
- HTMLTextAreaElement
- 実装
- 実装するインターフェイスはありません。
- IDL
[HTMLConstructor] interface HTMLTextAreaElement : HTMLElement { [CEReactions] attribute DOMString autocomplete; [CEReactions] attribute boolean autofocus; [CEReactions] attribute unsigned long cols; [CEReactions] attribute DOMString dirName; [CEReactions] attribute boolean disabled; readonly attribute HTMLFormElement? form; [CEReactions] attribute DOMString inputMode; [CEReactions] attribute long maxLength; [CEReactions] attribute long minLength; [CEReactions] attribute DOMString name; [CEReactions] attribute DOMString placeholder; [CEReactions] attribute boolean readOnly; [CEReactions] attribute boolean required; [CEReactions] attribute unsigned long rows; [CEReactions] attribute DOMString wrap; readonly attribute DOMString type; [CEReactions] attribute DOMString defaultValue; [CEReactions, TreatNullAs=EmptyString] attribute DOMString value; readonly attribute unsigned long textLength; readonly attribute boolean willValidate; readonly attribute ValidityState validity; readonly attribute DOMString validationMessage; boolean checkValidity(); boolean reportValidity(); void setCustomValidity(DOMString error); [SameObject] readonly attribute NodeList labels; void select(); attribute unsigned long selectionStart; attribute unsigned long selectionEnd; attribute DOMString selectionDirection; void setRangeText(DOMString replacement); void setRangeText(DOMString replacement, unsigned long start, unsigned long end, optional SelectionMode selectionMode = "preserve"); void setSelectionRange(unsigned long start, unsigned long end, optional DOMString direction); }; enum SelectionMode { "select", "start", "end", "preserve" // default };
- 仕様書
- https://html.spec.whatwg.org/multipage/forms.html#htmltextareaelement
説明
HTMLTextAreaElementを作成する例です。
JavaScript
// 要素を作成する
var element = document.createElement( "textarea" ) ; // <textarea></textarea>
// 属性をセットする
element.name = "hoge" ; // →<textarea name="hoge"></textarea>
入力内容は、valueが反映します。リセット時の初期値は、defaultValueで設定できます。
HTML
<textarea id="hoge"></textarea>
JavaScript
// 要素を取得する
var element = document.getElementById( "hoge" ) ;
// 入力内容を取得する
var inputValue = element.value ; // 現在、入力されている内容
// 入力内容を更新する
element.value = "Hello" ; // 入力内容が更新される
// リセット時の初期値を設定する
element.defaultValue = "Oh yeah!" ; // リセット時にセットされる
プロパティ
Node、Element、HTMLElementのプロパティを利用できます。
HTMLTextAreaElement.autocomplete
- Chrome
- ×
- Firefox
- ×
- Edge
- ×
- IE
- ×
- Safari
- ● 9.1+
- Opera
- ×
- iOS
- ● 10.0+
- Android
- ×
autocomplete属性を反映します。
HTMLTextAreaElement.autofocus
- Chrome
- ●
- Firefox
- ●
- Edge
- ●
- IE
- ● 10+
- Safari
- ●
- Opera
- ●
- iOS
- ●
- Android
- ●
autofocus属性を反映します。
HTMLTextAreaElement.cols
- Chrome
- ●
- Firefox
- ●
- Edge
- ●
- IE
- ●
- Safari
- ●
- Opera
- ●
- iOS
- ●
- Android
- ●
cols属性を反映します。
HTMLTextAreaElement.defaultValue
- Chrome
- ●
- Firefox
- ●
- Edge
- ●
- IE
- ●
- Safari
- ●
- Opera
- ●
- iOS
- ●
- Android
- ●
フォームのリセットを実行した時にセットされる初期値を返します。
HTMLTextAreaElement.dirName
- Chrome
- ● 17+
- Firefox
- ×
- Edge
- ×
- IE
- ×
- Safari
- ● 6.0+
- Opera
- ● 12+
- iOS
- ● 6.0+
- Android
- ● 4.4+
dirname属性を反映します。
HTMLTextAreaElement.disabled
- Chrome
- ●
- Firefox
- ●
- Edge
- ●
- IE
- ●
- Safari
- ●
- Opera
- ●
- iOS
- ●
- Android
- ●
disabled属性を反映します。
HTMLTextAreaElement.form
- Chrome
- ●
- Firefox
- ●
- Edge
- ●
- IE
- ●
- Safari
- ●
- Opera
- ●
- iOS
- ●
- Android
- ●
この要素が関連付けられているform要素を返します。
HTMLTextAreaElement.inputMode
- Chrome
- ×
- Firefox
- ×
- Edge
- ×
- IE
- ×
- Safari
- ×
- Opera
- ×
- iOS
- ×
- Android
- ×
inputmode属性を反映します。
HTMLTextAreaElement.labels
HTMLTextAreaElement.maxLength
- Chrome
- ●
- Firefox
- ●
- Edge
- ●
- IE
- ● 10+
- Safari
- ● 5.1+
- Opera
- ●
- iOS
- ●
- Android
- ●
maxlength属性を反映します。
HTMLTextAreaElement.minLength
- Chrome
- ● 40+
- Firefox
- ● 51+
- Edge
- ×
- IE
- ×
- Safari
- ×
- Opera
- ● 27+
- iOS
- ×
- Android
- ×
minlength属性を反映します。
HTMLTextAreaElement.name
- Chrome
- ●
- Firefox
- ●
- Edge
- ●
- IE
- ●
- Safari
- ●
- Opera
- ●
- iOS
- ●
- Android
- ●
name属性を反映します。
HTMLTextAreaElement.placeholder
- Chrome
- ●
- Firefox
- ●
- Edge
- ●
- IE
- ● 10+
- Safari
- ● 5.1+
- Opera
- ● 11.6+
- iOS
- ●
- Android
- ●
placeholder属性を反映します。
HTMLTextAreaElement.readOnly
- Chrome
- ●
- Firefox
- ●
- Edge
- ●
- IE
- ●
- Safari
- ●
- Opera
- ●
- iOS
- ●
- Android
- ●
readonly属性を反映します。
HTMLTextAreaElement.required
- Chrome
- ●
- Firefox
- ●
- Edge
- ●
- IE
- ● 10+
- Safari
- ● 5.1+
- Opera
- ●
- iOS
- ●
- Android
- ●
required属性を反映します。
HTMLTextAreaElement.rows
- Chrome
- ●
- Firefox
- ●
- Edge
- ●
- IE
- ●
- Safari
- ●
- Opera
- ●
- iOS
- ●
- Android
- ●
rows属性を反映します。
HTMLTextAreaElement.selectionDirection
- Chrome
- ● 15+
- Firefox
- ● 8+
- Edge
- ×
- IE
- ×
- Safari
- ● 6.0+
- Opera
- ● 15+
- iOS
- ● 6.0+
- Android
- ● 4.4+
範囲選択の方向を表す文字列を返します。
HTMLTextAreaElement.selectionEnd
- Chrome
- ●
- Firefox
- ●
- Edge
- ●
- IE
- ● 9+
- Safari
- ●
- Opera
- ●
- iOS
- ●
- Android
- ●
選択の終了位置のオフセットを返します。
HTMLTextAreaElement.selectionStart
- Chrome
- ●
- Firefox
- ●
- Edge
- ●
- IE
- ● 9+
- Safari
- ●
- Opera
- ●
- iOS
- ●
- Android
- ●
選択の開始位置のオフセットを返します。
HTMLTextAreaElement.textLength
- Chrome
- ●
- Firefox
- ●
- Edge
- ×
- IE
- ×
- Safari
- ● 5.1+
- Opera
- ●
- iOS
- ●
- Android
- ●
入力文字数を返します。
HTMLTextAreaElement.type
- Chrome
- ●
- Firefox
- ●
- Edge
- ●
- IE
- ●
- Safari
- ●
- Opera
- ●
- iOS
- ●
- Android
- ●
"textarea"
を返します。
HTMLTextAreaElement.validationMessage
- Chrome
- ●
- Firefox
- ●
- Edge
- ●
- IE
- ● 10+
- Safari
- ● 5.1+
- Opera
- ●
- iOS
- ●
- Android
- ●
入力内容の検証エラーメッセージを文字列で返します。
HTMLTextAreaElement.validity
- Chrome
- ●
- Firefox
- ●
- Edge
- ●
- IE
- ● 10+
- Safari
- ● 5.1+
- Opera
- ●
- iOS
- ●
- Android
- ●
入力内容の検証結果の情報を表すValidityStateを返します。
HTMLTextAreaElement.value
- Chrome
- ●
- Firefox
- ●
- Edge
- ●
- IE
- ●
- Safari
- ●
- Opera
- ●
- iOS
- ●
- Android
- ●
入力内容を反映します。
HTMLTextAreaElement.willValidate
- Chrome
- ●
- Firefox
- ●
- Edge
- ●
- IE
- ● 10+
- Safari
- ●
- Opera
- ●
- iOS
- ●
- Android
- ●
要素が、検証候補の場合はtrue
、検証候補じゃない場合はfalse
を返します。
HTMLTextAreaElement.wrap
- Chrome
- ● 16+
- Firefox
- ●
- Edge
- ●
- IE
- ●
- Safari
- ● 6.0+
- Opera
- ●
- iOS
- ● 6.0+
- Android
- ● 4.4+
wrap属性を反映します。
メソッド
EventTarget、Node、Element、HTMLElementのメソッドを利用できます。
HTMLTextAreaElement.checkValidity()
- Chrome
- ●
- Firefox
- ●
- Edge
- ●
- IE
- ● 10+
- Safari
- ● 5.1+
- Opera
- ●
- iOS
- ●
- Android
- ●
入力内容を検証し、検証エラーがある場合にinvalidイベントを発生させます。
HTMLTextAreaElement.reportValidity()
- Chrome
- ● 40+
- Firefox
- ● 49+
- Edge
- ×
- IE
- ×
- Safari
- ×
- Opera
- ● 27+
- iOS
- ×
- Android
- ×
入力内容を検証し、検証エラーがある場合にinvalidイベントを発生させ、さらに、検証エラーメッセージを表示します。
HTMLTextAreaElement.select()
- Chrome
- ●
- Firefox
- ●
- Edge
- ●
- IE
- ●
- Safari
- ●
- Opera
- ●
- iOS
- ●
- Android
- ●
入力されている全ての文字を選択状態にします。
HTMLTextAreaElement.setCustomValidity()
- Chrome
- ●
- Firefox
- ●
- Edge
- ●
- IE
- ● 10+
- Safari
- ● 5.1+
- Opera
- ●
- iOS
- ●
- Android
- ●
カスタム検証エラー状態にします。または、カスタム検証エラー状態を解除します。
HTMLTextAreaElement.setRangeText()
- Chrome
- ● 24+
- Firefox
- ● 27+
- Edge
- ×
- IE
- ×
- Safari
- ● 7.1+
- Opera
- ● 15+
- iOS
- ● 7.0+
- Android
- ● 4.4+
指定した範囲にテキストを挿入します。
HTMLTextAreaElement.setSelectionRange()
- Chrome
- ●
- Firefox
- ●
- Edge
- ●
- IE
- ● 9+
- Safari
- ●
- Opera
- ●
- iOS
- ●
- Android
- ●
指定した範囲を選択状態にします。
定数
Nodeの定数を利用できます。
サポート状況
HTMLTextAreaElementのサポート状況です。
ブラウザ | サポート状況 | ブラウザ | サポート状況 |
---|---|---|---|
Chrome | Supported | Firefox | Supported |
Edge | Supported | Internet Explorer | Supported |
Safari | Supported | Opera | Supported |
iOS Safari | Supported | Android | Supported |
Chrome
バージョン | サポート状況 | 公開時期 | シェア |
---|---|---|---|
57 | Supported | 2017年3月頃 | 0.1% |
56 | Supported | 2017年1月頃 | 12.02% |
55 | Supported | 2016年12月頃 | 12.36% |
54 | Supported | 2016年10月頃 | 0.44% |
53 | Supported | 2016年9月頃 | 0.25% |
52 | Supported | 2016年7月頃 | 0.27% |
51 | Supported | 2016年6月頃 | 0.4% |
50 | Supported | 2016年4月頃 | 0.32% |
49 | Supported | 2016年3月頃 | 0.47% |
48 | Supported | 2016年1月頃 | 0.02% |
47 | Supported | 2015年12月頃 | 0.06% |
46 | Supported | 2015年10月頃 | 0.56% |
45 | Supported | 2015年9月頃 | 0.01% |
44 | Supported | 2015年7月頃 | 0.83% |
43 | Supported | 2015年5月頃 | 0.05% |
42 | Supported | 2015年4月頃 | 0.05% |
41 | Supported | 2015年3月頃 | 0.01% |
40 | Supported | 2015年1月頃 | 0.59% |
39 | Supported | 2014年11月頃 | 0.02% |
38 | Supported | 2014年10月頃 | 0.08% |
37 | Supported | 2014年8月頃 | 0.01% |
36 | Supported | 2014年7月頃 | 0.01% |
35 | Supported | 2014年5月頃 | 0.01% |
34 | Supported | 2014年4月頃 | 0.14% |
33 | Supported | 2014年2月頃 | 0.01% |
32 | Supported | 2014年1月頃 | 0% |
31 | Supported | 2013年11月頃 | 0.01% |
30 | Supported | 2013年10月頃 | 0.03% |
29 | Supported | 2013年8月頃 | 0% |
28 | Supported | 2013年6月頃 | 0.03% |
27 | Supported | 2013年5月頃 | 0.01% |
26 | Supported | 2013年3月頃 | 0% |
25 | Supported | 2013年2月頃 | 0% |
24 | Supported | 2013年1月頃 | 0% |
23 | Supported | 2012年11月頃 | 0% |
22 | Supported | 2012年9月頃 | 0% |
21 | Supported | 2012年7月頃 | 0% |
20 | Supported | 2012年6月頃 | 0% |
19 | Supported | 2012年5月頃 | 0% |
18 | Supported | 2012年3月頃 | 0.01% |
17 | Supported | 2012年2月頃 | 0.01% |
16 | Supported | 2011年12月頃 | 0% |
15 | Supported | 2011年10月頃 | 0% |
14 | Supported | 2011年9月頃 | 0% |
Firefox
バージョン | サポート状況 | 公開時期 | シェア |
---|---|---|---|
52 | Supported | 2017年3月頃 | 0.12% |
51 | Supported | 2017年1月頃 | 1.7% |
50 | Supported | 2016年11月頃 | 0.78% |
49 | Supported | 2016年9月頃 | 0.02% |
48 | Supported | 2016年8月頃 | 0.07% |
47 | Supported | 2016年6月頃 | 0.03% |
46 | Supported | 2016年4月頃 | 0.01% |
45 | Supported | 2016年3月頃 | 0.1% |
44 | Supported | 2016年1月頃 | 0.01% |
43 | Supported | 2015年12月頃 | 0.02% |
42 | Supported | 2015年11月頃 | 0.01% |
41 | Supported | 2015年9月頃 | 0% |
40 | Supported | 2015年8月頃 | 0.02% |
39 | Supported | 2015年7月頃 | 0.01% |
38 | Supported | 2015年5月頃 | 0.02% |
37 | Supported | 2015年3月頃 | 0% |
36 | Supported | 2015年2月頃 | 0.01% |
35 | Supported | 2015年1月頃 | 0% |
34 | Supported | 2014年12月頃 | 0.01% |
33 | Supported | 2014年10月頃 | 0% |
32 | Supported | 2014年9月頃 | 0% |
31 | Supported | 2014年7月頃 | 0.01% |
30 | Supported | 2014年6月頃 | 0% |
29 | Supported | 2014年4月頃 | 0% |
28 | Supported | 2014年3月頃 | 0.01% |
27 | Supported | 2014年2月頃 | 0% |
26 | Supported | 2013年12月頃 | 0% |
25 | Supported | 2013年10月頃 | 0% |
24 | Supported | 2013年9月頃 | 0% |
23 | Supported | 2013年8月頃 | 0% |
22 | Supported | 2013年6月頃 | 0% |
21 | Supported | 2013年5月頃 | 0% |
20 | Supported | 2013年4月頃 | 0% |
19 | Supported | 2013年2月頃 | 0% |
18 | Supported | 2013年1月頃 | 0% |
17 | Supported | 2012年11月頃 | 0% |
16 | Supported | 2012年10月頃 | 0% |
15 | Supported | 2012年8月頃 | 0% |
14 | Supported | 2012年7月頃 | 0% |
13 | Supported | 2012年6月頃 | 0% |
12 | Supported | 2012年4月頃 | 0% |
11 | Supported | 2012年3月頃 | 0% |
10 | Supported | 2012年1月頃 | 0% |
9 | Supported | 2011年12月頃 | 0% |
8 | Supported | 2011年11月頃 | 0% |
7 | Supported | 2011年9月頃 | 0% |
6 | Supported | 2011年8月頃 | 0% |
5 | Supported | 2011年6月頃 | 0% |
4 | Supported | 2011年3月頃 | 0% |
Edge
バージョン | サポート状況 | 公開時期 | シェア |
---|---|---|---|
14 | Supported | 2016年2月頃 | 1.05% |
13 | Supported | 2015年9月頃 | 0.08% |
Internet Explorer
バージョン | サポート状況 | 公開時期 | シェア |
---|---|---|---|
11 | Supported | 2013年10月頃 | 4.99% |
10 | Supported | 2012年8月頃 | 0.09% |
9 | Supported | 2011年3月頃 | 0.18% |
8 | Supported | 2009年3月頃 | 0.04% |
7 | Supported | 2006年10月頃 | 0.01% |
6 | Supported | 2001年8月頃 | 0% |
Safari
バージョン | サポート状況 | 公開時期 | シェア |
---|---|---|---|
10 | Supported | 2016年10月頃 | 0% |
9.1 | Supported | 2015年9月頃 | 0% |
8.0 | Supported | 2014年10月頃 | 0% |
7.1 | Supported | 2013年10月頃 | 0% |
6.0 | Supported | 2012年7月頃 | 0% |
5.1 | Supported | 2011年7月頃 | 0% |
4 | Supported | 2009年6月頃 | 0% |
Opera
バージョン | サポート状況 | 公開時期 | シェア |
---|---|---|---|
43 | Supported | 2017年2月頃 | 0.06% |
42 | Supported | 2016年12月頃 | 0.09% |
41 | Supported | 2016年10月頃 | 0.01% |
40 | Supported | 2016年9月頃 | 0% |
39 | Supported | 2016年8月頃 | 0% |
38 | Supported | 2016年6月頃 | 0% |
37 | Supported | 2016年5月頃 | 0.01% |
36 | Supported | 2016年3月頃 | 0.01% |
35 | Supported | 2016年2月頃 | 0% |
34 | Supported | 2015年12月頃 | 0% |
33 | Supported | 2015年10月頃 | 0% |
32 | Supported | 2015年9月頃 | 0% |
31 | Supported | 2015年8月頃 | 0% |
30 | Supported | 2015年6月頃 | 0% |
29 | Supported | 2015年4月頃 | 0% |
28 | Supported | 2015年3月頃 | 0% |
27 | Supported | 2015年1月頃 | 0% |
26 | Supported | 2014年12月頃 | 0% |
25 | Supported | 2014年10月頃 | 0% |
24 | Supported | 2014年9月頃 | 0% |
23 | Supported | 2014年7月頃 | 0% |
22 | Supported | 2014年6月頃 | 0% |
21 | Supported | 2014年5月頃 | 0.01% |
20 | Supported | 2014年3月頃 | 0% |
19 | Supported | 2014年1月頃 | 0% |
18 | Supported | 2013年11月頃 | 0% |
17 | Supported | 2013年10月頃 | 0% |
16 | Supported | 2013年8月頃 | 0% |
15 | Supported | 2013年7月頃 | 0% |
12 | Supported | 2012年6月頃 | 0.02% |
11.6 | Supported | 2011年12月頃 | 0% |
11.1 | Supported | 2011年4月頃 | 0% |
iOS Safari
バージョン | サポート状況 | 公開時期 | シェア |
---|---|---|---|
10.0 | Supported | 2016年9月頃 | 39.65% |
9.1 | Supported | 2015年9月頃 | 5.39% |
8.3 | Supported | 2014年9月頃 | 1.03% |
7.0 | Supported | 2013年9月頃 | 0.24% |
6.0 | Supported | 2012年9月頃 | 0.05% |
5.1 | Supported | 2011年10月頃 | 0.03% |
Android
バージョン | サポート状況 | 公開時期 | シェア |
---|---|---|---|
4.4 | Supported | 2013年10月頃 | 0% |
4.3 | Supported | 2013年7月頃 | 0% |
4.2 | Supported | 2013年3月頃 | 0.03% |
4.1 | Supported | 2012年12月頃 | 0% |
4.0 | Supported | 2012年6月頃 | 1.61% |
2.3 | Supported | 2011年10月頃 | 0% |