Opis

input określa pole wejściowe, w którym użytkownik może wprowadzać dane. Pole wejściowe może się różnić na wiele sposobów, w zależności od atrybutu type.

Element <input> jest pusty, zawiera tylko atrybuty.

Przykład
 

kg



Kod:
Atrybuty
Atrybut Wartość Opis
accept file_extension[1]
audio/* [2]
video/* [3]
image/* [4]
media_type [5] 		Tylko dla type="file". Określa filtr(y) dla typów plików, które użytkownik może wybrać z okna dialogowego wprowadzania pliku. Przesyłanie plików powinno zostać zweryfikowane na serwerze. Więcej niż jedną wartość oddzielamy przecinkami:
1 konkretne rozszerzenie(a) pliku(ów), np. ".gif, .jpg, .png, .doc"
* wszystkie pliki: 2dźwiękowe / 3wideo / 4obrazu
5poprawny typ mediów bez parametrów. Zobacz IANA - typy mediów
alt text Tylko dla type="image". Określa alternatywny tekst dla obrazów, które z jakiś powodów nie mogą zostać wyświetlone.
autocomplete on
off
 Określa, czy element <input> powinien mieć włączone autouzupełnianie (w przeglądarce funkcja autouzupełniania formularzy musi być aktywna). Działa z następującymi typami (type): text, search, url, tel, email, password, datepickers, range i color. Domyślnie włączone - "on".
autofocus autofocus Określa, że element <input> powinien automatycznie zostać aktywowany po załadowaniu strony
checked checked Dla type="checkbox" lub type="radio". Określa, że element powinien być wstępnie wybrany. Atrybut logiczny.
dirname inputname.dir Określa, że kierunek tekstu pola wejściowego zostanie przesłany. Wartością atrybutu jest zawsze nazwa tego pola (name="myname"), po której następuje „.dir” (dirname=myname.dir).
disabled disabled Określa, że element <input> powinien być wyłączony
form form_id Określa formularz, do której należy element <input> (np. znajduje się poza danym formularzem a mimo to jest jego częścią). Wartość atrybutu - form_id - musi być atrybutem id elementu <form> w tym samym dokumencie.
formaction URL Dla type="submit" i type="image". Określa adres URL pliku, który przetworzy formant wejściowy po przesłaniu formularza. Przesłania atrybut action elementu <form>.
formenctype application/x-www-form-urlencoded[1]
multipart/form-data [2]
text/plain[3]		 Dla type="submit" i type="image" i tylko dla <form> z method="post". Określa, w jaki sposób dane formularza powinny być kodowane podczas przesyłania ich na serwer. Przesłania atrybut enctype elementu <form>.
1Domyślne. Wszystkie znaki są kodowane przed wysłaniem (spacje są konwertowane na symbole „+”, a znaki specjalne na wartości HEX ASCII).
2Żadne znaki nie są kodowane.
3Spacje są konwertowane na symbole „+”, ale żadne znaki specjalne nie są kodowane.
formmethod get
post		 Dla type="submit” lub type="image”. Definiuje metodę HTTP wysyłania danych na adres URL akcji. Przesłania atrybut method elementu <form>.
"GET" (domyślne) - dołącza dane formularza do adresu URL w parach nazwa/wartość: URL?name=value&name=value
POST - wysyła dane jako transakcję końcową HTTP.
formnovalidate formnovalidate Używany z type="submit". Określa, że elementy formularza nie powinny być sprawdzane podczas przesyłania. Atrybut logiczny. Przesłania atrybut novalidate elementu <form>.
formtarget _blank
_self
_parent
_top
framename		 Dla type="submit" lub type="image". Określa, gdzie ma być wyświetlana odpowiedź otrzymana po przesłaniu formularza. Przesłania atrybut target elementu <form>. Ponieważ ramki nie są obsługiwane w HTML5 ostatnie trzy wartości są używane z <iframe>.
formnovalidate formnovalidate Określa, że elementy formularza nie powinny być sprawdzane (weryfikowane) podczas przesyłania. Przesłania atrybut novalidate elementu <form>. Atrybut logiczny.
height
width		 pixels Tylko z <input type="image">. Określa wysokość / szerokość elementu <input> w pikselach.
list datalist_id Odnosi się do elementu <datalist> (wartość datalist_id = id <datalist>), który zawiera wstępnie zdefiniowaną listę opcji dla elementu <input>. Elementy te zostają powiązane (bind).
max
min		 number date Określa maksymalną / minimalną wartość dla elementu <input> (liczba lub data).
maxlength
minlength		 number Określa maksymalnie dozwoloną / minimalnie wymaganą liczbę znaków (tekst?) w elemencie <input>
multiple multiple Określa, że użytkownik może wprowadzić więcej niż jedną wartość w elemencie <input> (typy danych wejściowych: e-mail lub plik. kilka e-maili oddzielamy tu przecinkami). Atrybut logiczny.
name text Określa nazwę elementu <input>. (Uwaga: Tylko elementy formularza z atrybutem nazwy będą miały przekazane wartości podczas przesyłania formularza.)
pattern regexp Atrybut wzorca. Określa wyrażenie regularne, względem którego sprawdzana jest wartość elementu <input>
placeholder text Atrybut zastępczy. Określa krótką wskazówkę co do oczekiwanej wartości elementu <input>. Krótka wskazówka jest wyświetlana w polu wprowadzania, zanim użytkownik wprowadzi wartość. Działa z następującymi typami wprowadzania (input type): text, search, url, tel, email i password.
readonly readonly Określa, że pole wejściowe jest tylko do odczytu (nie można go modyfikować ale można np. kopiować z niego tekst) - można je np. pod pewnymi warunkami potem odblokować za pomocą JS. Formularz nadal będzie przesyłać pole readonly, nie przesyła za to pól, które są wyłączone (disabled)! Atrybut jest logiczny.
required required Określa, że pole wejściowe musi zostać wypełnione przed przesłaniem formularza. Działa z następującymi typami wprowadzania (input type): text, search, url, tel, email, password, date pickers, number, checkbox, radio i file. Atrybut logiczny.
size number Określa szerokość elementu <input> w znakach (domyślnie: 20). Działa w type=: text, search, tel, url, email i password.
src URL Tylko dla type = "image". Określa adres URL obrazu, który ma być używany jako przycisk przesyłania.
step number any Określa odstęp (krok, skok) między kolejnymi liczbami w polu elementu input (domyślnie wynosi 1). Może być używany razem z atrybutami max i min, aby utworzyć zakres legalnych wartości. Działa z type: number, range, date, datetime-local, month, week i time.
value text Określa wartość elementu. Atrybut w zależności od typu danych (type) określa:
  • "button", "reset", "submit" - tekst przycisku
  • "text", "password", "hidden" - początkową (domyślną) wartość pola wejściowego
  • "checkbox", "radio", "image" - wartość powiązaną z wejściem (to także wartość wysyłana)
    • Dla "file" nie ma możliwości jego użycia.
    type button
    checkbox
    color
    date
    datetime-local
    email
    file
    hidden
    image
    month
    number
    password
    radio
    range
    reset
    search
    submit
    tel
    text
    time
    url
    week    		 Określa typ elementu <input> do wyświetlenia. Domyślnym typem jest tekst. Nie jest wymaganym atrybutem, ale wg ekspertów powinniśmy go zawsze uwzględniać.
    button (przycisk) - klikalny przycisk (najczęściej używany w JS do aktywacji skryptu)
    checkbox (pole wyboru) - pole wyboru
    color (kolor) - próbnik kolorów
    date (data) - kontrolka daty (r, m, d (bez godziny))
    datetime-local - kontrolka daty i godziny (r, m, d, g (bez strefy czasowej)
    email - pole dla adresu e-mail
    file (plik)- pole wyboru pliku i przycisk „Przeglądaj” (w przesyłaniu plików)
    hidden (ukryty) - ukryte pole wejściowe
    image (obraz) - obraz jako przycisk przesyłania
    month (miesiąc) - kontrolka miesiąca i roku (bez strefy czasowej)
    number (liczba) - pole do wprowadzania liczby
    password (hasło) - pole hasła
    radio - przycisk opcji
    range (zakres) - kontrolka zakresu (jak suwak)
    reset - przycisk resetowania
    search (szukaj) - pole tekstowe do wprowadzania ciągu wyszukiwania
    submit (zatwierdź) - przycisk przesyłania
    tel - pole do wprowadzenia numeru telefonu
    text - jednowierszowe pole tekstowe (wartość domyślna)
    time (czas) - kontrolka do wprowadzania czasu (bez strefy czasowej)
    url - pole do wprowadzania adresu URL
    week (tydzień) - kontrolka tygodnia i roku (bez strefy czasowej)

    CSS (domyślne ustawienia)
    Info: