HTML5 Input tipləri

Input-lar istifadəçilərdən məlumat almaq üçün istifadə edilən sahələrdir. İstifadəçilərdən fərqli məlumatları almaq üçün müxtəlif giriş tipləri vardır.
HTML5 ilə form-larda istifadə etdiyimiz inputlar-a bir çox yeni məlumat tipi əlavə olunmuşdur.

Aşağıdakı siyahıda inputlar üçün istifadə edilən tiplər verilmişdir.

• button
• checkbox
• color (HTML5 ilə yeni gəldi)
• date (HTML5 ilə yeni gəldi)
• datetime (HTML5 ilə yeni gəldi)
• datetime-local (HTML5 ilə yeni gəldi)
• email (HTML5 ilə yeni gəldi)
• file
• hidden
• image
• month (HTML5 ilə yeni gəldi)
• number (HTML5 ilə yeni gəldi)
• password
• radio
• range (HTML5 ilə yeni gəldi)
• reset
• search (HTML5 ilə yeni gəldi)
• submit
• tel (HTML5 ilə yeni gəldi)
• text
• time (HTML5 ilə yeni gəldi)
• url (HTML5 ilə yeni gəldi)
• week (HTML5 ilə yeni gəldi)
 
HTML5 ilə yeni gələn tiplər, yeni brauzerlərdə normal işləyir. Ancaq bəzi köhnə brauzerlər (İnternet Explorer 8 və s.) bu dəyərləri normal text dəyəri olaraq qəbul edə bilər.
Input tiplərini nəzərdən keçirək:
 
button (düymə)
<input type=”button” value=”button”>
 
checkbox (bir və ya birdən çox seçim üçündür)
<input type="checkbox" value="qırmızı">
<input type="checkbox" value="mavi">

color (rəng seçimi üçün istifadə edilir)
<input type="color">
 
date (gün, ay və il ifadə etmək üçün tarix)
<input type="date" name="tarix">
 
datetime (tarixə əlavə olaraq saat məlumatını da verə bilərsiniz)
<input type="datetime">
 
datetime-local (yerli istifadəçilər üçün saat və tarix ilə zaman seçməyi təmin edir)
<input type="datetime-local">
 
email (yalnız e-mail ünvanı daxil etməyə icazə verir)
<input type="email">
 
file (fayl seçmək üçün istifadə olunur)
<input type="file">
 
hidden (gizli dəyər üçündür)
<input type="hidden">
 
image (şəkil əlavəsi etiketi)
<input type="image" src="sekil.jpg" alt="sekil" width="50" height="50">

month (seçdiyiniz ay və ili göstərir)
<input type="month">
 
number (rəqəm daxil etmək üçün istifadə edilir, minimum dəyər üçün "min", maksimum dəyər üçün "max", ədədin artma və azalma addımları üçün də "step" istifadə edilir)
<input type="number" min="0" max="100" step="10">
 
password (daxil olunan dəyəri gizləyir, şifrə yazmaq məqsədli istifadə edilir)
<input type="password">
 
radio (tək seçim üçün istifadə olunur)
<input type="radio" value="mavi">
<input type="radio" value="sarı">
 
range (qiymət aralığı kimi rəqəm aralıqlarını ifadə etmək üçün istifadə edilir, minimum dəyər üçün "min", maksimum dəyər üçün "max", aralıq dəyərinin artma və azalma addımları üçün də "step" istifadə edilir)
<input type="range" min="0" max="100" step="5">
 
reset (form içərisində istifadə edilən etiketlərdə istifadəçi tərəfindən yazılanları təmizləyir)
<input type="reset">
 
search (axtarış sahələri üçün istifadə edilir)
<input type="search">
 
submit (göndər düyməsi)
 <input type="submit">
 
tel (telefon nömrələrini yazmaq üçün istifadə edilir)
<input type="tel">
 
text (mətn sahəsi)
<input type="text">
 
time (saatı ifadə etmək üçün istifadə edilir)
<input type="time">
 
url (link daxil etmək üçün istifadə edilir)
<input type="url">
 
week (həftə məlumatı vermək üçün istifadə edilir. Seçilən günün hansı ilin neçənci həftəsi olduğu barədə məlumat verir)
<input type="week">
 
Aşağıdakı html nümunədə nəticələri görə bilərsiniz
Nümunəni görmək üçün klikləyin
HTML5