برچسب <input> HTML

تعریف و استفاده

<input> برچسب تعریف می‌کند که کاربر می‌تواند در آن داده‌ها را وارد کند.

<input> عنصر مهم‌ترین عنصر فرم است.

<input> عنصر می‌تواند به روش‌های مختلفی نمایش داده شود، بستگی به ویژگی type.

در اینجا انواع مختلف ورودی‌ها آورده شده است:

  • <input type="button">
  • <input type="checkbox">
  • <input type="color">
  • <input type="date">
  • <input type="datetime-local">
  • <input type="email">
  • <input type="file">
  • <input type="hidden">
  • <input type="image">
  • <input type="month">
  • <input type="number">
  • <input type="password">
  • <input type="radio">
  • <input type="range">
  • <input type="reset">
  • <input type="search">
  • <input type="submit">
  • <input type="tel">
  • <input type="text">(مقدار پیش‌فرض)
  • <input type="time">
  • <input type="url">
  • <input type="week">

مطالعه کنید ویژگی typeبرای مشاهده مثال‌های هر نوع ورودی، ببینید!

مثال

فرم HTML شامل سه فیلد ورودی است؛ دو فیلد متنی و یک دکمه ارسال:

<form action="/action_page.php">
  <label for="fname">نام:</label>
  <input type="text" id="fname" name="fname"><br><br>
  <label for="lname">نام خانوادگی:</label>
  <input type="text" id="lname" name="lname"><br><br>
  <input type="submit" value="ارسال">
</form>

سعی کنید خودتان امتحان کنید

توضیحات و کامنت‌ها

توضیح:لطفاً همیشه از برچسب <label> برای تعریف برچسب برای عناصر زیر استفاده کنید:

<input type="text">
<input type="checkbox">
<input type="radio">
<input type="file">
<input type="password">

ویژگی

ویژگی مقدار توضیح
accept
  • نام پسوند فایل
  • audio/*
  • video/*
  • image/*
  • نوع رسانه

تعریف می‌کند نوع فایل‌هایی که از طریق آپلود فایل ارسال می‌شوند.

تعریف می‌کند که فیلترهای نوع فایل‌هایی که کاربر می‌تواند از دیالوگ فایل انتخاب کند، چیست (تنها برای type="file" مناسب است).
alt متن تعریف می‌کند متن جایگزین برای تصویر (تنها برای type="image" مناسب است).
autocomplete
  • on
  • off
 تعریف می‌کند که عناصر <input> باید از خودکامپلتیشن استفاده کنند یا خیر.
autofocus autofocus تعریف می‌کند که عناصر <input> باید در بارگذاری صفحه به صورت خودکار تمرکز داشته باشند.
checked checked تعریف می‌کند که عناصر <input> باید در بارگذاری صفحه به صورت پیش‌انتخاب شده باشند (برای type="checkbox" یا type="radio" مناسب است).
dirname inputname.dir تعریف می‌کند جهت متن ارسالی.
disabled disabled تعریف می‌کند که عناصر <input> باید غیرفعال شوند.
form شناسه فرم تعریف می‌کند فرم متعلق به عناصر <input> است.
formaction URL تعریف می‌کند که URL برای پردازش فایل‌های ورودی کنترل‌های ورودی در ارسال فرم چیست (برای type="submit" و type="image" مناسب است).
formenctype
  • application/x-www-form-urlencoded
  • multipart/form-data
  • text/plain
 تعیین می‌کند که چگونه داده‌های فرم باید کدگذاری شوند تا به سرور ارسال شوند (برای type="submit" و type="image" مناسب است).
formmethod
  • get
  • post
 تعیین می‌کند که روش HTTP برای ارسال داده‌ها به URL action استفاده می‌شود (برای type="submit" و type="image" مناسب است).
formnovalidate formnovalidate تعیین می‌کند که در هنگام ارسال فرم، نباید بررسی شود.
formtarget
  • _blank
  • _self
  • _parent
  • _top
نام فریم 		تعیین می‌کند که پس از ارسال فرم، پاسخ دریافت شده کجا نمایش داده می‌شود (برای type="submit" و type="image" مناسب است).
height پیکسل تعیین ارتفاع عنصر <input> است (فقط برای type="image" مناسب است).
list datalist_id لیست <datalist> شامل گزینه‌های پیش‌تعیین شده شامل <input> را ارجاع می‌دهد.
max
  • اعداد
  • تاریخ
 تعیین ارزش بیشینه برای عنصر <input> است.
maxlength اعداد تعیین تعداد بیشینه کاراکترهایی که عنصر <input> مجاز است وارد کند.
min
  • اعداد
  • تاریخ
 تعیین ارزش کمینه برای عنصر <input> است.
minlength اعداد تعیین تعداد最少 کاراکترهای مورد نیاز در عنصر <input> است.
multiple multiple تعیین می‌کند که آیا کاربر می‌تواند چندین ارزش را در عنصر <input> وارد کند.
name متن تعیین نام عنصر <input> است.
pattern عبارت‌جبری تعیین نمونه‌های عبارت‌جبری برای بررسی ارزش <input> است.
placeholder متن تعیین پیام کوتاهی که برای توضیح ارزش پیش‌بینی شده <input> استفاده می‌شود.
popovertarget id عنصر تعیین عنصر پاپ‌آپ که باید فراخوانی شود (فقط برای type="button" مناسب است).
popovertargetaction
  • hide
  • show
  • toggle
 تعیین می‌کند که چه اتفاقی می‌افتد وقتی روی دکمه کلیک می‌کنید (فقط برای type="button" مناسب است).
readonly readonly تعیین می‌کند که فیلد ورودی فقط خوانا است.
required required تعیین می‌کند که باید فیلدهای ورودی پر شوند تا فرم ارسال شود.
size اعداد پر کردن عرض عنصر <input> را به تعداد کاراکتر تعیین می‌کند.
src URL URL تصویری که به عنوان دکمه ارسال استفاده می‌شود (فقط برای type="image" 适用).
step
  • اعداد
  • any
 فاصله مجاز بین اعداد در فیلد ورودی را مشخص می‌کند.
type
  • button
  • checkbox
  • color
  • date
  • datetime-local
  • email
  • file
  • hidden
  • image
  • month
  • number
  • password
  • radio
  • range
  • reset
  • search
  • submit
  • tel
  • text
  • time
  • url
  • week
 نوع <input> را که باید نمایش داده شود مشخص می‌کند.
value متن مقدار <input> را مشخص می‌کند.
width پیکسل دامنه <input> را مشخص می‌کند (تنها برای type="image" 适用 است).

خصوصیات جهانی

<input> برچسب‌ها همچنین از خصوصیات رویداد خصوصیات جهانی در HTML.

خصوصیات رویداد

<input> برچسب‌ها همچنین از خصوصیات رویداد خصوصیات رویداد در HTML.

تنظیمات پیش‌فرض CSS

بدون.

پشتیبانی مرورگر

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
پشتیبانی پشتیبانی پشتیبانی پشتیبانی پشتیبانی

صفحات مرتبط

آموزش HTML:

دستورالعمل‌های HTML DOM: