textbox

ユーザがテキストを入力することができる input フィールド。これは HTML の input 要素に似ています。デフォルトでは一行のテキストフィールドのみが表示されます。multiline 属性で複数行のフィールドを表示するように指定することもできます。

詳しい情報は XUL チュートリアルにあります。

属性
cols, decimalplaces, disabled, emptytext, hidespinbuttons, increment, label, max, maxlength, min, multiline, newlines, onchange, oninput, placeholder, preference, readonly, rows, searchbutton, size, spellcheck, tabindex, timeout, type, value, wrap, wraparound
プロパティ
accessibleType, clickSelectsAll, decimalPlaces, decimalSymbol, defaultValue, disabled, editor, emptyText, increment, inputField, label, max, maxLength, min, placeholder, readOnly, searchButton, selectionEnd, selectionStart, size, spinButtons, tabIndex, textLength, timeout, type, value, valueNumber, wrapAround
メソッド
decrease, increase, reset, select, setSelectionRange
スタイルクラス
plain

<vbox>
  <label control="your-name" value="Enter your name:"/>
  <textbox id="your-name" value="John"/>
</vbox>
Image:XUL_ref_textbox.png

属性

cols
型: 整数型
複数行の textbox で表示するための桁数。
decimalplaces
型: 整数型
表示する小数点以下の桁数。デフォルト値の 0 は小数点以下の桁を表示しません。小数点以下の桁数を無制限にしたいときは、値を Infinity にします。小数は float として格納されるので注意してください。
disabled
型: 論理型
要素が無効化されているかどうかを示します。ある要素が true に設定されていたら、その要素は無効化されています。無効化された要素は通常グレイ表示のテキストで描画されます。要素が無効化されていると、ユーザのアクションには応答せず、フォーカスもあてられず、command イベントも発生しません。

 

emptytext 非推奨 Gecko 2
型: 文字列型
textbox が値を持たない時に表示される文字列。これは、Gecko 2.0 で placeholder 属性に代わりました。この古い属性名は互換性のために残されていますが、使用している場合はコードを更新すべきです。
hidespinbuttons
型: 論理型
true の場合、数値ボックスは値を調節するための矢印ボタンを持ちません。値はキーボードで調節することができます。デフォルトの値は false です。
increment
型: 論理型
矢印がクリックされたときに (スクロールバーの) curpos あるいは (数値ボックスの) value 属性の変更される量。デフォルト値は 1 です。
label
型: 文字列型
この属性が設定され空でない場合、label プロパティを通してスクリーンリーダに渡されます。
max
型: 整数型
スケールまたは数値ボックスの取り得る最大値。スケールの場合の初期値は 100、数値ボックスの場合の初期値は無限。
maxlength
型: 整数型
textbox に入力することができる最大文字数。
{{ XULAttr("min") }}{{ page.unprefixedpath == 'XUL:textbox' ? template.Fx_minversion_inline(3) : '' }}
型: 整数型
スケールあるいは数値ボックスの取りうる最小値。デフォルト値は 0 です。
multiline
型: 論理型
true の場合、textbox は複数行を表示します。ユーザが Enter を押すと改行されます。false の場合、textbox は一行のみ入力を許可します。
newlines
型: 文字列型
textbox に貼り付けられた改行の扱い方。
可能な値:
pasteintact: 変更なしで改行を貼り付ける。
pastetofirst: 最初の改行の前のテキストのみを貼り付ける。残りのテキストは破棄されます。
replacewithcommas: 改行をカンマに置き換えたテキストを貼り付ける。
replacewithspaces: 改行をスペースに置き換えたテキストを貼り付ける。
strip: 改行を取り除いたテキストを貼り付ける。
stripsurroundingwhitespace: 空白を取り除いた改行付きのテキストを貼り付ける。
onchange
型: スクリプトコード
このイベントは、textbox の値が変更された時、送られます。イベントはフォーカスが他の要素に移動するまで送られません。
oninput
型: スクリプトコード
このイベントは、ユーザが textbox にテキストを入力した時、送られます。このイベントはテキストの表示が変更されたとき呼び出されるため、ユーザが表示不可能なキーを押した場合は呼び出されません。
placeholder
型: 文字列型
textbox が値を持たない時に表示される文字列。
preference
型: 要素の id
要素を対応する preference につなぎます。この属性は prefwindow 内で使用された場合のみ効果があります。preference の値は、要素の value プロパティと一致するように更新されます。
readonly
型: 論理型
true に設定した場合、ユーザは要素の値を変更できません。しかし、スクリプトからは依然として値を変更できます。
Gecko 2 note
(Firefox 4 / Thunderbird 3.3 / SeaMonkey 2.1)
Gecko 2.0 まで、readonly 属性は XBL フィールド上で正しく動作しませんでした。
rows
型: 整数型
要素内に表示する行数。要素がこの数値よりも多くの行を含むときはスクロールバーが現れます。要素内の実際の rows の値を取得するには getRowCount メソッドを使用してください。
searchbutton
型: 論理型
true の場合、ユーザが search ボタンを押すか Enter キーを押した時のみ、search フィールドのコマンドイベントが発生します。false の場合、ユーザが値を変更するだけでコマンドイベントが発生します。この属性は search 型のテキストボックスにのみ適用されます。
size
型: 整数型
textbox に表示することのできる文字数。
spellcheck
型: 論理型
true の場合、textbox のためのスペルチェックがデフォルトで有効になります。false の場合、スペルチェックがデフォルトで無効になります。
指定されない場合、これはデフォルトで false です。
tabindex
型: 整数型
要素のタブの順番。タブの順番は tab キーが押下されたときにフォーカスが移動する順番です。より大きな tabindex の値をもつ要素は、タブの遷移が後になります。
timeout
型: 整数型
時間制限付きの textbox のための、command イベント発生までのミリ秒数。タイマーはユーザが文字を入力すると開始します。ユーザが他の文字を入力するとタイマーがリセットされます。
type
型: 下記の値のいずれか一つ
特別な形式の textbox を使用するには、下記の値のいずれか一つを type 属性に設定します。
  • autocomplete: 自動補完をサポートする textbox。自動補完 textbox についての詳しい情報は、自動補完 (autocomplete)のドキュメントをご覧ください。(Mozilla) (Firefox)
  • number: 数字のみを入力することができる textbox。さらに、値を増減するための矢印ボタンが textbox の次に現れます。number textbox を設定するための属性は次のものがあります min および max, increment, wraparound, hidespinbuttons
  • password: 入力した内容を隠す textbox。パスワードの入力に使用されます。
  • timed: この textbox は、ユーザが文字を入力して時間が経つと command イベントを発生させます。遅延時間は timeout 属性で設定します。この形式は例えば、ユーザが入力した window の情報を更新するために使用します。ユーザが時間内にさらにキーを入力すれば、タイマーを発動させないために継続的に更新する必要はありません。ユーザが Enter キーを押下した場合にも command イベントが発生します。
value
型: 文字列型
デフォルト値が textbox に入力されます。この属性はデフォルト値のみが保持され、ユーザがテキストを入力しても変更されることはありません。更新された値を取得するには value プロパティを使用してください。数値ボックスのデフォルト値は、0 または min プロパティが返す最小値のどちらか大きいほうです。
wrap
型: 文字列型
textbox 内のワードラップを無効にするには、この属性の値を off に設定します。この属性が指定されていないときは、ワードラップが有効です。
wraparound
型: 論理型
true の場合、数値ボックスの値は、最大値または最小値を超えると丸められます。最小値および最大値は両方とも無限であってはなりません。

プロパティ

accessibleType
型: 整数型
要素の accessibility オブジェクトの種類を示す値。
clickSelectsAll
型: 論理型
true に設定した場合、フォーカスされた時、textbox の内容が選択されます。カーソルは変更無しで取り去られます。
decimalPlaces
型: 整数型
decimalplaces 属性の値の取得と設定
decimalSymbol
型: 文字列型
小数点に使用する文字。デフォルト値はピリオド (.) です。
defaultValue
型: 文字列型
textbox のデフォルト値の取得と設定。
disabled
型: 論理型
disabled 属性の値の取得と設定。
editor
型: nsIEditor
editable なテキストのための nsIEditor への参照。このプロパティは読み取り専用です。
emptyText 非推奨 Gecko 2
型: 文字列型
textbox が値を持たないときに表示される文字列の取得/設定。これは、Gecko 2.0 で placeholder プロパティに代わりました。この古い属性名は互換性のために残されていますが、使用している場合はコードを更新すべきです。
increment
型: 整数型
increment 属性の値の取得と設定。
inputField
型: textbox 要素
Mozilla では、XUL textbox は HTML の input 要素のラッパとして実装されています。この読み取り専用のプロパティは、この内部 input 要素への参照を保持します。
label
型: 文字列型
label 属性を設定します。label 属性が設定されており空でなければ、これを取得します。そうでなければ、関連付けられた label 要素の適用可能な value を返します。それ以外は emptyText プロパティを返します。属性値の取得はスクリーンリーダにとって最も役立ちます。
max
型: 整数型
max 属性の値の取得と設定。
maxLength
型: 整数型
textbox に入力することができる文字数の最大値。
min
型: 整数型
min 属性の値の取得と設定。
placeholder
型: 文字列型
textbox が値を持たないときに表示される文字列の取得と設定。
readOnly
型: 論理型
true に設定すると、ユーザは要素の値を変更できなくなります。
searchButton
型: 論理型
searchbutton 属性の値の取得と設定。
selectionEnd
型: 整数型
フィールドのテキストの選択部分の末尾の取得または設定。selectionStart プロパティと共に使用します。この値は選択後の文字の index を指定します。この値が selectionStart プロパティの値と等しいときは text が選択されませんが、値は textbox 内のキャレット(カーソル) の位置を示します。
selectionStart
型: 整数型
フィールドのテキストの選択部分の先頭の取得または設定。selectionEnd プロパティと共に使用します。値は選択された最初の文字の index を指定します。
size
型: 整数型
size 属性の値の取得と設定。
spinButtons
型: 要素
この読み取り専用のプロパティは、数値ボックスで使用される spinbuttons 要素への参照を返します。
tabIndex
型: 整数型
tabindex 属性の値の取得と設定。
textLength
型: 整数型
textbox に入力されたテキストの長さを保持。このプロパティは読み取り専用です。
timeout
型: 整数型
timeout 属性の値の取得と設定。
type
型: 文字列型
type 属性の値の取得と設定。
value
型: 文字列型
textbox の現在の値を文字列として保持します。現在の値を変更するには、このプロパティを設定します。
valueNumber
型: 数値
value プロパティが文字列を保持するのと対照的に、valueNumber プロパティは数値ボックスの現在の値が含まれる数値です。
wrapAround
型: 論理型
wraparound 属性の値の取得と設定。

メソッド

decrease()
戻り値の型: 戻り値無し
scale または数値ボックスの値を increment 分減らす
increase()
戻り値の型: 戻り値なし
scale または数値ボックスの値を increment 分増やす。
reset()
戻り値の型: 戻り値無し
preference の値をデフォルトにリセットします。
textbox については、アンドゥ処理リストを消去します (Gecko 1.9)。
select()
戻り値の型: 戻り値無し
textbox 内のすべてのテキストを選択します。
setSelectionRange( start, end )
戻り値の型: 戻り値無し
textbox の選択部分を設定します。start 引数は選択範囲の最初の文字の index です。end 引数は選択範囲の直後の文字の index です。テキストを選択せずに指定の位置へカーソルを移動するには、両方の引数を同じ値に設定してください。

スタイルクラス

次のクラスは要素のスタイル付けに使用されます。これらのクラスは、ユーザの選択したテーマに自然に合うようにするため、要素のスタイルを直接変更する代わりに使用されます。

plain
このクラスによって、要素は border や margin なしで表示されます。

補足

複数行のテキストボックスでは、maxlength 属性は動作しません。代替策として、以下のように JavaScript と onkeypress イベントハンドラを使用してください。

XUL スクリプト:

<textbox id="pnNote" multiline="true" rows="2" cols="70" onkeypress="return pnCountNoteChars(event);"/>

Javascript:

function pnCountNoteChars(evt) {
  //allow non character keys (delete, backspace and and etc.)
  if ((evt.charCode == 0) && (evt.keyCode != 13))
    return true;

  if (evt.target.value.length < 10) {
    return true;
  } else {
    return false;
  }
}

関連項目

インタフェース
nsIAccessibleProvider, nsIDOMXULTextboxElement

ドキュメントのタグと貢献者

 このページの貢献者: Marsf, Mgjbot, Taken
 最終更新者: Marsf,