types inputs
همانطور که می دانید input ها محفظه ای برای جمع آوری اطلاعات کاربر هستند.
برای مشخص کردن نحوه نمایش input ها ، باید از ویژگی type استفاده کنید.
مقادیر ویژگی type را به همراه توضیحات ، در جدول زیر مشاهده می کنید :
| مقادیر ویژگی type | توضیحات |
|---|---|
| button | مقدار button یک دکمه قابل کلیک را تعریف می کند |
| checkbox | مقدار checkbox یک دکمه برای تیک زدن تعریف می کند |
| color | مقدار color ، یک فیلد ورودی حاوی رنگ را تعریف می کند |
| date | مقدار date ، یک فیلد حاوی تاریخ را تعریف می کند |
| datetime-local | مقدار datetime-local ، یک فیلد حاوی تاریخ و زمان را تعریف می کند |
| مقدار email ، یک فیلد حاوی ایمیل را تعریف می کند | |
| file | مقدار file یک دکمه برای آپلود عکس تعریف می کند |
| hidden | مقدار hidden ، یک فیلد ورودی پنهان را تعریف می کند |
| image | مقدار image یک دکمه برای بارگذاری عکس تعریف می کند |
| month | مقدار month ، یک فیلد ورودی ، حاوی ماه و سال را تعریف می کند |
| number | مقدار number یک فیلد ورودی برای دریافت عدد را تعریف می کند |
| password | مقدار password یک فیلد برای دریافت پسورد تعریف می کند |
| radio | مقدار radio یک دکمه برای روشن کردن گزینه تعریف می کند |
| range | مقدار range ، یک فیلد ورودی حاوی رنگ که مقدار آن مهم نیست تعریف می کند |
| reset | مقدار reset یک دکمه برای بازنشانی اطلاعات تعریف می کند |
| search | مقدار seaarch ، یک فیلد برای جستجو تعریف می کند |
| submit | مقدار submit یک دکمه برای ارسال داده های فرم تعریف می کند |
| tel | مقدار tel ، یک فیلد ورودی برای دریافت شماره تلفن تعریف می کند |
| text | مقدار text یک فیلد ورودی متنی را تعریف می کند |
| time | مقدار time ، یک فیلد حاوی زمان را تعریف می کند |
| url | مقدار url ، یک فیلد ورودی حاوی آدرس را تعریف می کند |
| week | مقدار week ، یک فیلد ورودی حاوی هفته و سال را تعریف کنند |
نکته: مقدار پیشفرض type در input ها برابر text است
input Type Text
مقدار Text به توسعه دهندگان وب این امکان را می دهد تا یک فیلد ورودی متنی را تعریف کنند.
مقدار text برای فیلد های name , family و ... استفاده می شود.
مثالی از ویژگی Type به همراه مقدار Text را مشاهده می کنید :
<input type="text">input Type Password
مقدار password یک فیلد ورودی متنی را تعریف می کند.
این فیلد متن های درون خود را به صورت پسورد نمایش می دهد.
این مقدار اغلب برای فیلد های password استفاده می شود.
مثالی از ویژگی type با مقدار password :
<input type="password">input Type Submit
مقدار submit یک دکمه برای ارسال داده های یک فرم به صفحه action تعریف می کند.
برای ارسال داده ، باید مقدار action را برابر با آدرس مورد نظر قرار دهید.
مثالی از ویژگی type با مقدار submit :
<input type="submit">input Type Reset
مقدار reset یک دکمه برای بازنشانی داده های یک فرم تعریف می کند.
مثالی از ویژگی type با مقدار reset :
<input type="reset">input Type Radio
مقدار Radio یک دکمه برای تایید کردن تعریف می کند.
این دکمه اغلب برای تعیین جنسیت استفاده می شود.
مثالی از ویژگی type با مقدار radio :
<input type="radio">input Type Checkbox
مقدار Checkbox یک دکمه قابل کلیک را تعریف می کند.
این مقدار برخلاف مقدار radio اجباری نیست.
مثالی از ویژگی type با مقدار checkbox :
<input type="checkbox">input Type Button
مقدار button یک دکمه قابل کلیک را تعریف می کند.
مثالی از ویژگی type با مقدار button :
<input type="button">input Type Color
مقدار color یک فیلد حاوی رنگ را تعریف می کند.
مثالی از ویژگی type با مقدار color :
<input type="color">input Type Date
مقدار date یک فیلد حاوی تاریخ را تعریف می کند.
مثالی از ویژگی type با مقدار date :
<input type="date">input Type DateTime-Local
مقدار DateTime-Local یک فیلد حاوی تاریخ و زمان تعریف می کند.
این فیلد بدون هیچ تاریخ زمانی است.
مثالی از ویژگی type به همراه مقدار DateTime-Local :
<input type="datetime-local">input Type Email
مقدار email ، یک فیلد برای دریافت ایمیل کاربر تعریف می کند.
مثالی از ویژگی type به همراه مقدار email :
<input type="email">input Type Image
مقدار image یک دکمه برای آپلود عکس تعریف می کند.
مثالی از ویژگی type با مقدار image :
<input type="image">input Type File
مقدار file ، یک دکمه برای آپلود فایل تعریف می کند.
مثالی از ویژگی type با مقدار file :
<input type="file">input Type Hidden
مقدار hidden یک فیلد پنهان را تعریف می کند.
مثالی از ویژگی type به همراه مقدار hidden :
<input type="hidden">input Type Month
مقدار month ، یک فیلد ورودی حاوی سال و ماه را تعریف می کند.
مثالی از ویژگی type به همراه مقدار month :
<input type="month">input Type Number
مقدار number یک فیلد ورودی حاوی عدد را تعریف می کند.
مثالی از ویژگی type با مقدار number :
<input type="number">input Type Range
مقدار range ، یک فیلد حاوی رنگ که مقدار دقیق آن مهم نیست را ، تعریف می کند.
مثالی از ویژگی type به همراه مقدار range :
<input type="range">input Type Search
مقدار search ، یک فیلد برای جستجو تعریف می کند.
مثالی از ویژگی type به همراه مقدار search :
<input type="search">input Type Tel
مقدار Tel ، یک فیلد برای دریافت شماره تلفن کاربر تعریف می کند.
مثالی از ویژگی type با مقدار Tel :
<input type="tel">input Type Time
مقدار Time به کاربران اجازه می دهد تا یک زمان را انتخاب کنند.
مثالی از ویژگی type با مقدار time :
<input type="time">input Type Url
مقدار url ، یک فیلد برای دریافت آدرس کاربر تعریف می کند.
مثالی از ویژگی type به همراه مقدار url :
<input type="url">input Type Week
مقدار week ، یک فیلد ورودی حاوی سال و هفته را تعریف می کند.
مثالی از ویژگی type به همراه مقدار week :
<input type="week">خلاصه درس
در این بخش از آموزش با انواع input ها آشنا شدید.
به صورت پیشفرض input ها به صورت text هستند.
در این بخش تمامی چیزی که برای نوشتن فرم نیاز دارید را می موزید
احسان اسلامی
