Visit Mozilla.org

XUL:textbox (Firefox autocomplete)

出典: MDC

« XUL リファレンス HOME    [ | 属性 | プロパティ | メソッド | 関連項目 ]

この要素は、textbox の type 属性を autocomplete に設定することによって作成されます。これは、ユーザが入力しはじめると可能な補完リストが含まれるポップアップを表示する textbox を作成します。

Firefox は Mozilla suite とは異なる自動補完 (autocomplete) 機構を使用します。下の例は、ユーザの履歴を検索する自動補完 textbox を作成します。

属性
accesskey, autocompletepopup, autocompletesearch, autocompletesearchparam, completedefaultindex, crop, disableautocomplete, disabled, disablekeynavigation, enablehistory, focused, forcecomplete, ignoreblurwhilesearching, inputtooltiptext, label, maxlength, maxrows, minresultsforpopup, nomatch, onchange, oninput, onsearchcomplete, ontextentered, ontextreverted, open, readonly, showcommentcolumn, size, tabindex, tabscrolling, timeout, type, value
プロパティ
accessibleType, completeDefaultIndex, controller, crop, disableAutoComplete, disableKeyNavigation, disabled, editable, focused, forceComplete, ignoreBlurWhileSearching, inputField, label, maxLength, maxRows, minResultsForPopup, open, popup, popupOpen, searchCount, searchParam, selectionEnd, selectionStart, showCommentColumn, showImageColumn,size, tabIndex, tabScrolling, textLength, textValue, timeout, type, value
メソッド
getSearchAt, onSearchComplete, onTextEntered, onTextReverted, select, setSelectionRange

[編集]

<textbox type="autocomplete" autocompletesearch="history"/>

[編集] 属性

XUL 要素からの継承
align, allowevents, allownegativeassertions, class, coalesceduplicatearcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortDirection, sortResource, sortResource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width

accesskey
型: character
ショートカットキーとして使用される文字を設定します。この文字はその要素の label 属性のテキストに現れる文字の一つでなければいけません。

autocompletepopup
型: popup 要素の id
popup 要素の id は、要素のための自動補完の候補を保持します。

autocompletesearch
型: 値のスペースで区切られたリスト
検索コンポーネント名のスペースで区切られたリスト。各コンポーネントは nsIAutoCompleteSearch インタフェースを実装します。コンポーネントは @mozilla.org/autocomplete/search;1?name= を使用して作成され、name がこの属性のリストに記載されます。
  • history: ブラウザの URL 履歴を検索します。
  • form-history: ユーザがフォームフィールドに入力した値を検索します。

autocompletesearchparam
型: string
検索コンポーネントに渡される文字列。

completedefaultindex
型: boolean
true の場合、ユーザが入力した値に最も一致する値が textbox に入力されます。false に設定するか省略すると、値をリストから選択しなければなりません。

crop
型: 下記の値のいずれか一つ
要素の label に与えられた空間が小さ過ぎるときは、crop 属性によって指定された側のテキストが切り取られます。テキストが切り取られた場所には省略記号 (ellipsis) が使用されます。ボックスの方向が反対の場合は、切り取られる場所も反対側になります。
  • start: テキストは先頭から切り取られます。
  • end: テキストは末尾から切り取られます。
  • left: 非推奨 テキストは左側から切り取られます。
  • right: 非推奨 テキストは右側から切り取られます。
  • center: テキストの中央が切り取られ、通常、テキストの先頭と末尾が表示されます。
  • none: テキストは省略記号を使用して切り取られません。しかし、テキストがあまりに長い場合は単純に削除されます。削除する側は CSS の行揃え (text alignment) に依存します。

disableautocomplete
型: boolean
textbox 上の自動補完 (autocomplete) を無効にするにはこの属性を true に設定してください。これは、フィールドの自動補完を一時的に無効にするために使用されます。

disabled
型: 真偽値
要素が無効化されているかどうかを示します。ある要素が true に設定されていたら、その要素は無効化されています。無効化された要素は通常グレイ表示のテキストで描画されます。要素が無効化されていると、ユーザのアクションには応答せず、フォーカスもあてられず、command イベントも発生しません。

disablekeynavigation
型: boolean
この属性が使用されない場合、ユーザは、リスト内の特定の項目へ、そのラベルの最初の文字を押下して移動することができます。これはインクリメンタルに行われるため、追加のキーを押下すると、さらに項目を絞り込んで選択します。この機能は、この属性を true に設定することによって無効化されます。

enablehistory
型: boolean
true の場合、矢印ボタンが textbox の末尾に現れます。この矢印が押されると、すべての使用可能な候補のドロップダウンメニューが開きます。

focused
型: boolean
要素がフォーカスされているとき、この属性値は true です。

forcecomplete
型: boolean
true の場合、textbox がフォーカスを失うと、そこに最も一致するものが入力されます。false の場合、ユーザが選択した項目のみが入力されます。

ignoreblurwhilesearching
型: boolean
true の場合、検索している間は blur イベントが無視され、自動補完 popup が表示されません。

inputtooltiptext
型: string
textbox の tooltip テキスト。

label
型: string
要素上に表示するlabel。 省略された場合、テキストは表示されない。

maxlength
型: integer
textbox に入力することができる最大文字数。

maxrows
型: integer
候補リストに一度に表示する行数。scrollbar が現れるので、ユーザは残りの項目を見渡すことができます。

minresultsforpopup
型: integer
popup 表示のために返す必要のある候補の最少数。

nomatch
型: boolean
この属性は、最後まで検索した結果一致しなかったとき、true に設定されます。

onchange
型: script code
onchange 属性内のコードは、要素の値が変更された時、呼び出されます。

oninput
型: script code
このイベントは、ユーザが textbox にテキストを入力した時、送られます。このイベントはテキストの表示が変更されたとき呼び出されるため、ユーザが表示不可能なキーを押下したときは呼び出されません。

onsearchcomplete
型: script code
このイベントハンドラは、自動補完検索 (autocomplete search) が完了して結果が利用可能になった時、呼び出されます。

ontextentered
型: script code
このイベントハンドラは、textbox のための候補が選択された時、呼び出されます。

ontextreverted
型: script code
このイベントハンドラは、ユーザが Esc を押下して textbox を元の補完されていない値に戻した時、呼び出されます。

open
型: boolean
menutype ボタンについて、メニューが開かれたとき、open 属性が true に設定されます。メニューが閉じられると open 属性は提供されません。

readonly
型: boolean
true に設定した場合、ユーザは要素の値を変更できません。しかし、スクリプトからは依然として値を変更できます。

showcommentcolumn
型: boolean
true の場合、popup にコメント列が表示されます。URL 履歴では、コメント列に各 URL のページのタイトルが含まれます。この属性が指定されていないときはコメント列が表示されません。

size
型: integer
textbox に表示することのできる文字数。

tabindex
型: 整数
要素のタブの順番。タブの順番は tab キーが押下されたときにフォーカスが移動する順番です。より大きな tabindex の値をもつ要素は、タブの遷移が後になります。

tabscrolling
型: boolean
true の場合、ユーザは候補リストを Tab キーの押下によって繰り返し見ることができます。false (デフォルト) の場合、Tab キーは次の要素にフォーカスを移動します。

timeout
型: integer
時間制限付きの textbox のための、command イベント発生までのミリ秒数。タイマーはユーザが文字を入力すると開始します。ユーザが他の文字を入力するとタイマーがリセットされます。

type
型: 下記の値のいずれか一つ
特別な形式の textbox を使用するには、下記の値のいずれか一つを type 属性に設定します。
  • autocomplete: 自動補完をサポートする textbox。自動補完 textbox についての詳しい情報は、自動補完 (autocomplete) のドキュメントをご覧ください。(Mozilla) (Firefox)
  • number: 数字のみを入力することができる textbox。さらに、値を増減するための矢印ボタンが textbox の次に現れます。number textbox を設定するための属性は次のものがあります min および max, increment, wraparound, hidespinbuttonsFirefox 3 の新機能
  • password: 入力した内容を隠す textbox。パスワードの入力に使用されます。
  • timed: この textbox は、ユーザが文字を入力して時間が経つと command イベントを発生させます。遅延時間は timeout 属性で設定します。この形式は例えば、ユーザが入力した window の情報を更新するために使用します。ユーザが時間内にさらにキーを入力すれば、タイマーを発動させないために継続的に更新する必要はありません。ユーザが Enter キーを押下した場合にも command イベントが発生します。

value
型: 文字列
文字列の属性はデータ値を要素に関連付けます。特定の目的のために使われるわけではありませんが、スクリプトからあなた自身の用途のためにアクセスできます。

[編集] プロパティ

XUL 要素からの継承
align, allowEvents, boxObject, builder, className, collapsed, contextMenu, controllers, currentItem, database, datasources, dir, flex, height, hidden, id, left, listBoxObject, maxHeight, maxWidth, menu, minHeight, minWidth, observes, ordinal, orient, pack, persist, ref, resource, statusText, style, tooltip, tooltipText, top, value, width

DOM 要素からの継承
attributes, childNodes, cloneNode, firstChild, lastChild, localName, namespaceURI, nextSibling, nodeName, nodeType, nodeValue, ownerDocument, parentNode, prefix, previousSibling, tagName

accessibleType
型: integer
要素の accessibility オブジェクトの種類を示す値。

completeDefaultIndex
型: boolean
completedefaultindex 属性の値の取得と設定。

controller
型: nsIAutoCompleteController
自動補完要素のための controller を返す。

crop
型: string
crop 属性の値の取得と設定。

disableAutoComplete
型: boolean
disableautocomplete 属性の値の取得と設定。

disableKeyNavigation
型: boolean
disableKeyNavigation 属性の値の取得と設定。

disabled
型: 真偽値
disabled 属性の値の取得と設定。

editable
型: boolean
自動補完フィールドは editable なため、このプロパティは常に true を返します。

focused
型: boolean
focused 属性の値の取得と設定。

forceComplete
型: boolean
forcecomplete 属性の値の取得と設定。

ignoreBlurWhileSearching
型: boolean
ignoreblurwhilesearching 属性の値の取得と設定。

inputField
型: textbox element
Mozilla では、XUL textbox は HTML の input 要素のラッパとして実装されています。この読み取り専用のプロパティは、この内部 input 要素への参照を保持します。

label
型: string
label 属性の値の取得と設定。

maxLength
型: integer
textbox に入力することができる文字数の最大値。

maxRows
型: integer
maxrows 属性の値の取得と設定。

minResultsForPopup
型: integer
minresultsforpopup 属性の値の取得と設定。

open
型: boolean
open 属性の値の取得と設定。

popup
型: popup 要素の id
ユーザが textbox 上をクリックしたときに現れる、popup 要素の id の値を設定します。

popupOpen
型: boolean
popup が開かれているかどうかを示す。popup を開閉するにはこのプロパティを設定します。

searchCount
型: integer
使用された検索コンポーネントの数を返す。このプロパティは読み取り専用です。

searchParam
型: string
autocompletesearchparam 属性の値の取得と設定。

selectionEnd
型: integer
フィールドのテキストの選択部分の末尾の取得または設定。selectionStart プロパティと共に使用します。この値は選択後の文字の index を指定します。この値が selectionStart プロパティの値と等しいときは text が選択されませんが、値は textbox 内のキャレット(カーソル) の位置を示します。

selectionStart
型: integer
フィールドのテキストの選択部分の先頭の取得または設定。selectionEnd プロパティと共に使用します。値は選択された最初の文字の index を指定します。

showCommentColumn
型: boolean
showcommentcolumn 属性の値の取得と設定。

XUL:Property:showImageColumn

size
型: integer
size 属性の値の取得と設定。

tabIndex
型: 整数
tabindex 属性の値の取得と設定。

tabScrolling
型: boolean
tabscrolling 属性の値の取得と設定。

textLength
型: integer
textbox に入力されたテキストの長さを保持。このプロパティは読み取り専用です。

textValue
型: string
textbox の内容を返す。value プロパティと同等です。

timeout
型: integer
timeout 属性の値の取得と設定。

type
型: '
自動補完 textbox は autocomplete に設定されます。

value
型: 文字列
value 属性の値の取得と設定。

[編集] メソッド

XUL 要素からの継承
blur, click, doCommand, focus, getElementsByAttribute

DOM 要素からの継承
addEventListener, appendChild, dispatchEvent, getAttribute, getAttributeNode, getAttributeNodeNS, getAttributeNS, getElementsByTagName, getElementsByTagNameNS, hasAttribute, hasAttributeNS, hasAttributes, hasChildNodes, insertBefore, isSupported, normalize, removeAttribute, removeAttributeNode, removeAttributeNS, removeChild, removeEventListener, replaceChild, setAttribute, setAttributeNode, setAttributeNodeNS, setAttributeNS

getSearchAt( index )
戻り値の型: string
与えられた index の検索コンポーネントを返す。コンポーネントは autocompletesearch 属性で設定されます。

onSearchComplete()
戻り値の型: 戻り値なし
onsearchcomplete イベントハンドラを呼び出す。このメソッドを呼び出してはいけません。

onTextEntered()
戻り値の型: event result
ontextentered イベントハンドラを呼び出す。このメソッドを呼び出してはいけません。

onTextReverted()
戻り値の型: event result
ontextreverted イベントハンドラを呼び出す。このメソッドを呼び出してはいけません。

select()
戻り値の型: 戻り値なし
textbox 内のすべてのテキストを選択します。

setSelectionRange( start, end )
戻り値の型: 戻り値なし
textbox の選択部分を設定します。start 引数は選択範囲の最初の文字の index です。end 引数は選択範囲の直後の文字の index です。テキストを選択せずに指定の位置へカーソルを移動するには、両方の引数を同じ値に設定してください。

[編集] 関連項目

インタフェース
nsIAccessibleProvider, nsIAutoCompleteInput, nsIDOMXULMenuListElement
記事
How to implement custom autocomplete search component