Ten element jest tworzony poprzez ustawienie atrybutu type elementu textbox na autocomplete
. Jest używany do utworzenia elementu textbox z wyskakującym okienkiem zawierającym listę możliwych uzupełnień tego, co użytkownik zaczął wpisywać.
Firefox używa innego mechanizmu automatycznego uzupełnienia niż przeglądarka Mozilla Suite. Przykład poniżej stworzy textbox z auto uzupełnianiem, który będzie przeszukiwał historię użytkownika.
- Atrybuty
- 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
- Własności
- accessible, completeDefaultIndex, controller, crop, disableAutoComplete, disableKeyNavigation, disabled, editable, focused, forceComplete, ignoreBlurWhileSearching, inputField, label, maxLength, maxRows, minResultsForPopup, open, popup, popupOpen, searchCount, searchParam, selectionEnd, selectionStart, showCommentColumn, size, tabIndex, tabScrolling, textLength, textValue, timeout, textbox.type, value
Przykłady
<textbox type="autocomplete" autocompletesearch="history"/>
Atrybuty
-
accesskey
- Typ: znak
- Powinien być ustawiony na literę, która zostanie zastosowana jako klawisz dostępu. Litera ta powinna być jedną z liter, które są wyświetlane w etykiecie tekstowej (
) dla elementu.label
Przykład
<vbox> <label value="Enter Name" accesskey="e" control="myName"/> <textbox id="myName"/> <button label="Cancel" accesskey="n"/> <button label="Ok" accesskey="O"/> </vbox>
Zobacz także
Atrybut label
, atrybut acceltext
-
autocompletepopup
- Typ: id elementu wyskakującego (popup)
-
id
elementupopup
wykorzystywanego do przechowywania wyników automatycznego uzupełniania dla tego elementu.
-
autocompletesearch
- Typ: lista wartości oddzielonych spacją
- Lista szukanych nazw komponentów oddzielona spacją, który każdy implementuje interfejs nsIAutoCompleteSearch. Komponenty są tworzone za pomocą nazwy
@mozilla.org/autocomplete/search;1?name=
, gdzie: name jest listą w tym atrybucie.
-
history
: Przeszukuje hostorię adresów URL przeglądarki, -
form-history
: Przeszukuje wartości, które użytkownik wpisał w pola formularza.
-
autocompletesearchparam
Nowość w Thunderbird 2 Requires SeaMonkey 1.1 - Typ: string
- Łańcuch znaków, który jest komponentem poszukiwania.
-
crop
- Typ: jedna z poniższych wartości
- Jeśli etykieta elementu jest zbyt duża by zmieścić się w danym miejscu, to jej tekst zostanie skrócony po stronie określonej przy pomocy atrybutu
crop
. Wycięty fragment tekstu zostanie zastąpiony wielokropkiem. Jeśli kierunek pudełka jest określony w lewą stronę, to skrócenie tekstu nastąpi w tym samym kierunku (czyli z lewej strony):
-
start
: Tekst będzie skrócony z lewej strony. -
end
: Tekst będzie skrócony z prawej strony. -
left
: Tekst będzie skrócony z lewej strony. -
right
: Tekst będzie skrócony z prawej strony. -
center
: Tekst będzie skrócony w środku, pokazując oba końce: początek i koniec normalnego tekstu. -
none
: Tekst nie będzie skrócony przy zastosowaniu wielokropka. Jednakże, tekst skrócony zostanie po prostu obcięty, jeśli będzie za duży. Strona skrócenia owego tekstu zależy od rozmieszczenia tekstu określonego w arkuszu stylów CSS.
menupopup > menuitem, menupopup > menu { max-width: none; }
-
disableAutocomplete
- Typ: boolean
- Jeśli
true
, zachowanie automatyczne zostanie wyłączone. Możesz użyć skryptu do zmiany do zmiany tego atrybutu. Jeślifalse
, domyślnie, autouzupełnianie jest włączone.
-
disabled
- Typ: boolean
- Określa, czy element jest wyłączony. Jeśli atrybut ten ma wartość
true
, to element będzie wyłączony. Wyłączone elementy zazwyczaj są wyszarzone. Jeśli element jest wyłączony, nie odpowiada na czynności użytkownika, nie może zostać na niego ustawiony focus, a zdarzenie command nie zostanie wywołane.
<!-- Pole wyboru włącza/wyłącza przycisk --> <checkbox label="Enable button" onclick="document.getElementById('buttRemove').disabled = this.checked"/> <button id="buttRemove" label="Remove All" disabled="true"/>
-
enablehistory
- Typ: boolean
- Jeśli jest
true
, przycisk strzałki pokaże się na końcu pola tekstowego, a w momencie naciśnięcia go otworzy rozwijane menu wszystkich dostępnych rezultatów.
-
focused
- Typ: boolean
- Ten atrybut jest ustawiony na
true
, jeśli element jest aktywny (focused).
-
ignoreblurwhilesearching
- Typ: boolean
- Jeśli
true
, zdarzenia blur są ignorowane podczas szukania, co znaczy, że automatyczne wyskakujące okienka nie znikną.
-
inputtooltiptext
- Typ: string
- Tekst podpowiedzi dla pudełka tekstu.
-
label
- Typ: string
- Etykieta, która zostanie wyświetlona na elemencie. Jeśli zostanie on usunięty, to żaden tekst nie zostanie wyświetlony.
-
maxlength
- Typ: integer
- Maksymalna liczba znaków, które można wpisać w pole tekstowe.
-
maxrows
- Typ: integer
- Liczba wierszy do pokazania na liście rezultatów w czasie. Pasek przewijania będzie wyświetlony więc użytkownik może przewijać poprzez remaining items.
-
minresultsforpopup
- Typ: integer
- Minimalna liczba wyniku, która musi być zwrócona dla wyświetlonego okienka pop-up.
-
nomatch
- Typ: boolean
-
Ten atrybut będzie ustawiony na
true
, jeśli ostatni rezultat szukania nie jest dopasowany.
-
onchange
- Typ: kod skryptu
- Kod w atrybucie
onchange
jest wywołany, kiedy wartość elementu jest zmieniana.
-
onsearchcomplete
- Typ: Kod skryptu
- Ten uchwyt zdarzenia jest wywołany, kiedy zakończone zostało automatyczne wyszukiwanie, a wyniki są dostępne.
-
ontextentered
- Typ: kod skryptu
- Ten uchwyt zdarzenia jest wywoływany, kiedy wynik jest zaznaczony dla pola tekstowego.
-
ontextreverted
- Typ: kod skryptu
- Ten uchwyt zdarzenia jest wywołany, gdy użytkownik naciśnie Escape aby przywrócić pole tekstowe do jego oryginalnej niekompletnej wartości.
-
open
- Typ: boolean
- Dla przycisków o
type
ustawionym namenu
, atrybutopen
jest ustawiany natrue
, kiedy menu jest otwarte. Atrybutopen
nie jest obecny, jeśli menu jest zamknięte.
-
readonly
- Typ: boolean
- Jeśli ustawiony jest na
true
, to użytkownik nie będzie mógł zmienić wartości elementu. Jednakże wartość wciąż może zostać zmodyfikowana poprzez skrypt.
-
showCommentColumn
- Typ: boolean
-
Jeśli
true
, kolumna komentarza pojawi się w okienku wyskakującym. Dla historii adresów URL, kolumnę komentarzy będzie stanowić tytuł strony połączony z każdym adresem URL. Jeśli ten atrybut nie jest określony, kolumna komentarza nie pojawi się.
-
size
- Typ: integer
- Liczba znaków, które mogą zostać wyświetlone w polu tekstowym.
-
tabindex
- Typ: integer
- Porządek dla przełączania elementów klawiszem Tab. Elementy o wyższym tabindex umieszczane są w dalszej części sekwencji przełączania.
- type
- Typ:jedna z wartości poniżej
- Możemy ustawić typ tego atrybutu na jedną z poniższych wartości dla bardziej specjalistycznych typów pola tekstowego. Nie ustawiaj tego typu, jeśli chcesz zastosować regularne pole tekstowe.
autocomplete
: Pole tekstowe, które obsługuje auto uzupełnianie. Aby zdobyć więcej informacji na temat autouzupełniania pól tekstowych, przejdź do dokumentacji o autouzupełnianiu (Mozilla) (Firefox)number
: A textbox that only allows the user to enter numbers. In addition, arrow buttons appear next to the textbox to let the user step through values. There are several attributes that allow the number textbox to be configured, includingmin
,max
,increment
,wraparound
, andhidespinbuttons
.password
: Pole tekstowe, które ukrywa wpisywaną treść, stosowane dla wpisywania haseł w pole tekstowe.timed
: This textbox will fire a command event after the user types characters and a certain time has passed. The delay is set with thetimeout
attribute. You might use this type, for instance, to update information elsewhere in the window as the user types, without the need for continuous updates since the timer will not fire if the user types more keys in the meantime. The command event will also fire if the user presses the Enter key.
-
value
- Typ: string
- Atrybut łańcucha znaków pozwalający na współpracę wartości danych z elementem. Nie jest stosowany dla określenia jakiegoś konkretnego celu, lecz można go wykorzystać w skrypcie do własnego użytku.
Własności
-
accessible
- Typ: nsIAccessible
- Zwraca obiekt dostępności dla elementu.
-
completeDefaultIndex
- Typ: boolean
-
Pobiera i ustawia wartość atrybutu
completedefaultindex
.
-
controller
- Typ: nsIAutoCompleteController
- Zwraca kontener dla automatycznego uzupełnienia elementu.
-
disableAutoComplete
- Typ: boolean
-
Pobiera i ustawia wartość atrybutu
disableautocomplete
.
-
editable
- Typ: boolean
-
Pola automatycznie uzupełniane są edytowalne, więc ta własność zwróci
true
.
-
forceComplete
- Typ: boolean
-
Pobiera i ustawia wartość atrybutu
forcecomplete
.
-
ignoreBlurWhileSearching
- Typ: boolean
- Pobiera i ustawia wartość atrybutu
ignoreblurwhilesearching
.
-
inputField
- Typ: element textbox
- W Mozilli, pole tekstowe w języku XUL jest zaimplementowane jako otoczenie wokół elementów kontrolek formularza (input) języka HTML. Ta własność tylko do odczytu podtrzymuje odniesienie do wewnętrznego elementu input.
-
maxLength
- Typ: integer
- Maksymalna liczba znaków w polu tekstowym, jaką można wpisać.
-
minResultsForPopup
- Typ: integer
-
Pobiera i ustawia wartość atrybutu
minresultsforpopup
.
-
popupOpen
- Typ: boolean
- Wskazuje gdzie jest otwierane (lub nieotwierane) okienko popup. Ustaw tą własność do otwarcia lub zamknięcia popup.
-
searchCount
- Typ: integer
- Zwraca liczbę użytych komponentów. Ta własność jest tylko do odczytu.
-
searchParam
- Typ: string
-
Pobiera i ustawia wartość atrybutu
autocompletesearchparam
.
-
selectionEnd
- Typ: integer
-
Pobiera i ustawia koniec zaznaczonej części pola tekstu. Stosujemy ze sprzężeniem z własnością
selectionStart
. Wartość określa indeks znaku za zaznaczeniem. Jeśli ta wartość jest równa sumie wartości własnościselectionStart
, to żaden tekst nie jest zaznaczony, lecz wartość sygnalizuje pozycję wstawki (kursora) wewnątrz pola tekstowego.
-
selectionStart
- Typ: integer
-
Pobiera lub ustawia początek zaznaczonej części pola tekstu. Stosujemy w sprzężeniu z własnością
selectionEnd
. Wartość określa indeks pierwszego zaznaczonego znaku.
-
showCommentColumn
- Typ: boolean
-
Pobiera i ustawia wartość atrybutu
showcommentcolumn
.
-
tabScrolling
- Typ: boolean
-
Pobiera i ustawia wartość atrybutu
tabscrolling
.
-
textLength
- Typ: integer
- Podtrzymuje długość wprowadzanego tekstu w polu tekstowym. Ta własność jest tylko do odczytu.
- type
- Typ: '
-
Ustawia wartość
autocomplete
, aby mieć samo uzupełniające się pole tekstowe.
Metody
-
getSearchAt( index )
- Zwraca typ: string
-
Zwraca komponent szukania z danym indeksem. Komponenty są ustawiane z atrybutem
autocompletesearch
.
-
onSearchComplete()
- Zwraca typ: nie zwraca wartości
-
Wywołuje uchwyt zdarzenia
onsearchcomplete
. Nie powinieneś wywoływać tej metody samej w sobie.
-
onTextEntered()
- Zwraca typ: rezultat zdarzenia
-
Wywołujemy uchwyt zdarzenia
ontextentered
. Nie powinieneś wywoływać tej metody samej w sobie.
-
onTextReverted()
- Zwraca typ: rezultat zdarzenia
-
Wywołujemy uchwyt zdarzenia
ontextreverted
. Nie powinieneś wywoływać tej metody samej w sobie.
-
select()
- Zwraca typ: nie zwraca wartości
- Zaznacza cały tekst w polu tekstowym.
-
setSelectionRange( start, end )
- Zwraca typ: nie zwraca wartości
- Ustawia zaznaczoną porcję pola tekstowego, gdzie argumentem początkowym start jest pierwszy zaznaczony znak i argument końcowym end jest indeks znaku po zaznaczeniu. Ustawiając oba argumenty na tę samą wartość, pozwoli nam na przesunięcie kursora do przesłanej pozycji bez zaznaczenia tekstu.