HTML Input Types यह define करते हैं कि <input> element किस तरह का data accept करेगा।
Different input types user experience improve करते हैं और browser-level validation भी provide करते हैं।
HTML5 ने कई नए input types introduce किए हैं।
text Input Type
Single-line text input के लिए use होता है।
<input type="text">
Name, username, title जैसे values के लिए common है।
password Input Type
Password hide करने के लिए use होता है।
<input type="password">
Typed text dots या asterisks में दिखाई देता है।
email Input Type
Email address input के लिए use होता है।
<input type="email">
Browser automatically email format validate करता है।
number Input Type
Numeric values input करने के लिए use होता है।
<input type="number">
Min, max और step attributes support करता है।
<input type="number" min="1" max="10">
tel Input Type
Phone number input के लिए use होता है।
<input type="tel">
Mobile devices पर numeric keypad open होता है।
url Input Type
Website URL input के लिए use होता है।
<input type="url">
Browser URL format validate करता है।
search Input Type
Search fields के लिए use होता है।
<input type="search">
Search-related UI features browser provide कर सकता है।
date Input Type
Date select करने के लिए use होता है।
<input type="date">
Calendar picker browser द्वारा show किया जाता है।
time Input Type
Time select करने के लिए use होता है।
<input type="time">
datetime-local Input Type
Date और time दोनों select करने के लिए use होता है।
<input type="datetime-local">
month Input Type
Month और year select करने के लिए use होता है।
<input type="month">
week Input Type
Week number select करने के लिए use होता है।
<input type="week">
radio Input Type
Single option select करने के लिए use होता है।
<input type="radio" name="gender"> Male
<input type="radio" name="gender"> Female
Same name attribute group बनाता है।
checkbox Input Type
Multiple options select करने के लिए use होता है।
<input type="checkbox"> HTML
<input type="checkbox"> CSS
file Input Type
File upload करने के लिए use होता है।
<input type="file">
Multiple files allow करने के लिए:
<input type="file" multiple>
range Input Type
Slider के रूप में value select करने के लिए use होता है।
<input type="range" min="0" max="100">
color Input Type
Color picker दिखाने के लिए use होता है।
<input type="color">
hidden Input Type
User को दिखाई नहीं देता, लेकिन data submit होता है।
<input type="hidden" value="123">
submit Input Type
Form submit करने के लिए use होता है।
<input type="submit" value="Submit">
reset Input Type
Form को default state में reset करता है।
<input type="reset">
button Input Type
Custom actions के लिए use होता है।
<input type="button" value="Click Me">
image Input Type
Image को submit button की तरह use किया जाता है।
<input type="image" src="submit.png">
HTML5 Input Types के फायदे
Built-in validation मिलती है
Better mobile keyboard support मिलता है
Less JavaScript की जरूरत होती है
User experience improve होता है
HTML Input Types Summary
Input type define करता है कि input कैसा होगा
HTML5 में कई advanced input types available हैं
Correct input type validation और UX बेहतर बनाता है
Forms में proper input types use करना best practice है