سبد (0)

تگ input در HTML

مثال (تگ input در HTML)

یک فرم HTML با سه فیلد input، دو text fields و یک دکمه submit:

<form action="demo_form.asp">
  First name: <input type="text" name="fname"><br>
  Last name: <input type="text" name="lname"><br>
  <input type="submit" value="Submit">
</form>

خودتان امتحان کنید »

تعریف و کاربرد تگ input در HTML

تگ <input> مشخص کننده یک فیلد ورودی، که کاربر می تواند در آن اطلاعات را وارد کند.

عنصر <input> به منظور اعلام کنترل ورودی داخل عنصر <form> قرار می گیرد، که کاربر می تواند اطلاعات را وارد کند.

یک فیلد input را می توان در زمینه های گوناگون، بسته به نوع خصوصیت type استفاده کرد.

پشتیبانی مرورگرها از تگ input در HTML

عنصر          
<input> بله بله بله بله بله

نکته ها و ترفندها

نکته: عنصر <input> خالی بوده و تنها شامل ویژگی ها می باشد.

نکته: استفاده از عنصر <label> برای تعریف یک برچسب برای عنصر <input> است.

تفاوت بین HTML 4.01 و HTML5

ویژگی "align" در HTML5 پشتیبانی نمی شود.

در HTML5، تگ  <input> چندین ویژگی جدید دارد و برای ویژگی type چندین مقدار جدید تعریف شده است.

تفاوت بین  HTML و XHTML

در HTML، تگ <input> تگ پایانی ندارد.

در XHTML، تگ <input> باید با یک تگ پایانی بسته شود. مانند: <input />

خصوصیت ها

= جدید در HTML5.

خصوصیت مقدار توضیحات
accept file_extension
audio/*
video/*
image/*
media_type

مشخص کننده نوع فایلی که سرور آن را می پذیرد.

(فقط برای نوع  "file")
align left
right
top
middle
bottom

در HTML5 پشتیبانی نمی شود.

مشخص می کند که image input در چه جهتی تراز شود.

(فقط برای نوع "image")
alt text برای image یک متن جایگزین مشخص می کند.                   (فقط برای نوع  "image")
autocomplete on
off		 این خصوصیت مشخص می کند که مقادیر یک فرم یا یک فیلد متنی بصورت اتوماتیک پر شود یا نه.
autofocus autofocus این خصوصیت باعث می شود که بعد از لود شدن صفحه، مکان نما بصورت پیشفرض روی آن فیلد قرار گیرد.
checked checked مشخص می کند که عنصر <input > در هنگام لود شدن صفحه به صورت پیش فرض انتخاب شده باشد.
(برای نوع "checkbox" یا "radio")
disabled disabled مشخص می کند که عنصر <input> باید غیر فعال باشد.
form form_id این خصوصیت فرم یا فرم هایی که فیلد مورد نظر به آن ها تعلق دارد را مشخص می کند.
formaction URL آدرس فایلی که مقادیر کنترل های ورودی بعد از ارسال در آن پردازش می شوند را مشخص می کند.( برای انواع ورودی submit و image استفاده می شود)
formenctype application/x-www-form-urlencoded
multipart/form-data
text/plain		 چگونگی رمز کردن داده های فرم، هنگام ارسال را مشخص می کند.(برای انواع ورودی submit و image استفاده می شود)
formmethod get
post		 مشخص می کند که ارسال اطلاعات از فرم HTML به سرور به چه شکل باشد. (برای انواع ورودی submit و image استفاده می شود)
formnovalidate formnovalidate این خصوصیت نشان می دهد که فیلدهای ورودی برای ارسال به سرور نیاز به اعتبارسنجی ندارد.
formtarget _blank
_self
_parent
_top
framename		 نشان می دهد، پاسخی که از سرور دریافت شده است کجا نمایش داده شود. (برای انواع ورودی submit و image استفاده می شود)
height pixels ارتفاع عنصر  <input> را مشخص می کند.
 (فقط برای نوع "image")
list datalist_id این خصوصیت یک datalist را به یک فیلد متنی متصل می کند.
max number
date		 مقدار maximum برای عنصر <input> را مشخص می کند.
maxlength number تعداد maximum کاراکتری که عنصر <input> در خود جای می دهد.
min number
date		 مقدار minimum برای عنصر<input> را مشخص می کند.
multiple multiple مشخص می کند که کاربر می تواند بیش از یک مقدار در عنصر   <input> وارد کند.
name text یک نام برای عنصر <input> مشخص می کند.
pattern regexp الگویی برای بررسی اعتبار یک فیلد ورودی مشخص می کند.
placeholder text یک عبارت را به صورت کم رنگ در داخل فیلد ورودی می نویسد که با فوکوس روی آن فیلد از بین می رود و فیلد خالی می شود.
readonly readonly مشخص می کند که فیلد input فقط خواندنی است.
required required مشخص می کند که پر کردن فیلد input قبل از ارسال فرم باید انجام شود. 
size number مشخص می کند که چه تعداد کاراکتر در عنصر<input> جای کیرد. 
src URL مشخص کننده URL تصویری که به عنوان دکمه ارسال استفاده می شود.(فقط برای نوع "image")
step number تعداد فواصل قانونی برای یک فیلد input را مشخص می کند.         
type button
checkbox
color
date
datetime
datetime-local
email
file
hidden
image
month
number
password
radio
range
reset
search
submit
tel
text
time
url
week		 مشخص کننده نوع عنصر<input> و اینکه چگونه نمایش داده شود.
value text برای عنصر <input> مقداری را مشخص می کند.
  
width pixels عرض عنصر <input> را مشخص می کند.                      (فقط برای نوع "image")

ویژگی های عمومی تگ input در HTML

تگ <input> از ویژگی های عمومی در HTML پشتیبانی می کند.

رویدادهای عمومی تگ input در HTML

تگ <input> از رویدادهای عمومی در HTML پشتیبانی می کند.

آموزش های مرتبط

آموزش HTML-فرم ها 

مرجع اشیاء اچ تی ام ال:

نوشته شده توسط سمیه فخری
بازدید: 28582

در میان شش هزار مطلب آموزشی منتشر شده در بیاموز، جستجو نمایید ...

تمامی محصولات و خدمات این وبسایت، حسب مورد دارای مجوزهای لازم از مراجع مربوطه می‌باشند و فعالیت‌های این سایت تابع قوانین و مقررات جمهوری اسلامی ایران است.
logo-samandehi مجوز نشر دیجیتال از وزرات فرهنگ و ارشاد اسلامی پرداخت آنلاین - بانک ملت معرفی بیاموز در شبکه سه