برچسب <input> در اچ‌تی‌ام‌ال

از ویکی‌کد، دانشنامهٔ برنامه‌نویسی
پرش به ناوبری پرش به جستجو
کنترل ورودی را تعریف می‌کند
معرفی شده در نسخهٔ:۲
حذف شده در نسخهٔ: هنوز در حال استفاده است
ویژگی‌های مجاز:به پائین مراجعه کنید
تنظیمات پیش‌فرض CSS:ندارد


{{منو اسکرول چپ|نام منو={{مرجع منو اچ‌تی‌ام‌ال|expanded=مرجع}}}}

مثال

یک فرم اچ‌تی‌ام‌ال با سه فیلد ورودی (input)؛ دو فیلد متنی و یک دکمهٔ ارسال:


تعریف و کاربرد

برچسب <input> یک فیلد ورودی را مشخص می‌کند، که کاربر می‌تواند داده‌ها را وارد کند.[۱]

عنصرهای <input> درون یک عنصر <form> استفاده می‌شوند تا کنترل‌های ورودی را اعلام کنند که به کاربران اجازه می‌دهد تا داده‌ها را وارد کنند.

یک فیلد ورودی، بسته به ویژگی نوع (type attribute)، می‌تواند از جهات مختلفی متفاوت باشد.

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

عنصر Chrome Internet Explorer / Edge Firefox Safari Opera
<input> بله بله بله بله بله

نکات و ملاحظات

توجه: عنصر <input> خالی است، فقط حاوی ویژگی‌ها است.

نکته: همواره از برچسب <label> برای تعریف عنوان (label) برای <input type="text">, <input type="checkbox">, <input type="radio">, <input type="file"> و <input type="password"> استفاده کنید.

Attributes

ویژگی مقدار شرح
accept file_extension

audio/*

video/*

image/*

media_type

Specifies a filter for what file types the user can pick from the file input dialog box (only for type="file")

یک فیلتر را برای نوع فایل‌هایی مشخص می‌کند که کاربر می‌تواند از جعبهٔ گفتگوی ورودی فایل انتخاب کند (فقط برای type="file")

alt text یک متن جایگزین را برای تصاویر مشخص می‌کند (فقط برای type="image")
autocomplete on

off

مشخص می‌کند که آیا یک عنصر <input> باید تکمیل خودکار را بصورت فعال داشته باشد
autofocus autofocus مشخص می‌کند که آیا هنگام بارگذاری صفحه، یک عنصر <input> باید بصورت خودکار مورد تمرکز (focus) قرار بگیرد
checked checked مشخص می‌کند که آیا هنگام بارگذاری صفحه، یک عنصر <input> باید از پیش انتخاب شده (pre-selected) باشد (برای type="checkbox" یا type="radio")
dirname inputname.dir مشخص می‌کند که جهت متن، ارسال خواهد شد
disabled disabled مشخص می‌کند که عنصر <input> باید غیرفعال شود
form form_id فرمی را که عنصر <input> به آن تعلق دارد مشخص می‌کند
formaction URL Specifies the URL of the file that will process the input control when the form is submitted (for type="submit" and type="image")

URL فایلی را مشخص می‌کند که پس از ارسال فرم، کنترل ورودی را پردازش می‌کند

میانبر:
الگو:اتب


formenctype application/x-www-form-urlencoded

multipart/form-data

text/plain

مشخص می‌کند که داده‌های فرم، هنگام ارسال به سرور، چگونه باید رمزگذاری شوند (برای type="submit" و type="image")
formmethod get

post

روش HTTP برای فرستادن داده‌ها به URL اقدام (Action URL) را تعریف می‌کند (برای type="submit" و type="image")
formnovalidate formnovalidate تعریف می‌کند که عنصرهای فرم، هنگام ارسال، نباید اعتبارسنجی شوند
formtarget _blank

_self

_parent

_top

framename

مشخص می‌کند که پاسخی که پس از ارسال فرم دریافت شده، را در کجا نمایش دهد (برای type="submit" و type="image")
height pixels ارتفاع یک عنصر <input> را مشخص می‌کند (فقط برای type="image")
list datalist_id به یک عنصر <datalist> اشاره دارد که حاوی گزینه‌های ازپیش‌تعریف‌شده برای عنصر <input> است
max number

date

مقدار بیشینه (حداکثر) را برای یک عنصر <input> مشخص می‌کند
maxlength number حداکثر تعداد کاراکترهایی را که در یک عنصر <input> اجازه داده شده را مشخص می‌کند
min number

date

مقدار کمینه (حداقل) را برای یک عنصر <input> مشخص می‌کند
minlength number حداقل تعداد کاراکترهایی را که در یک عنصر <input> لازم است مشخص می‌کند
multiple multiple مشخص می‌کند که کاربر می‌تواند بیشتر از یک مقدار را در عنصر <input> وارد کند
name text نام یک عنصر <input> را مشخص می‌کند
pattern regexp یک عبارت منظم را مشخص می‌کند که مقدار یک عنصر <input> در برابر آن بررسی شده‌است
placeholder text یک اشارهٔ کوتاه را مشخص می‌کند که به توصیف مقدار مورد انتظار از یک عنصر <input> می‌پردازد
readonly readonly مشخص می‌کند که فیلد ورودی فقط‌خواندنی است
required required مشخص می‌کند که فیلد ورودی باید قبل از ارسال فرم حتماً پر شود
size number پهنای یک عنصر <input> را با کارکترها مشخص می‌کند
src URL URL تصویر را برای استفاده بعنوان دکمهٔ ارسال مشخص می‌کند (فقط برای type="image")
step number

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 text مقدار یک عنصر <input> را مشخص می‌کند

'

width pixels پهنای یک عنصر <input> را مشخص می‌کند (فقط برای type="image")

ویژگی‌های سراسری

همچنین برچسب <input> از ویژگی‌های سراسری در اچ‌تی‌ام‌ال پشتیبانی می‌کند.

ویژگی‌های رویداد

همچنین برچسب <input> از ویژگی‌های رویداد در اچ‌تی‌ام‌ال پشتیبانی می‌کند.

صفحات مرتبط

آموزش اچ‌تی‌ام‌ال:

مرجع DOM اچ‌تی‌ام‌ال:

  • شیء دکمهٔ ورودی (Input Button Object)
  • شیء جعبهٔ انتخاب ورودی (Input Checkbox Object)
  • شیء رنگ ورودی (Input Color Object)
  • شیء تاریخ ورودی (Input Date Object)
  • شیء تاریخ‌زمان ورودی (Input Datetime Object)
  • شیء تاریخ‌زمان‌محلی ورودی (Input DatetimeLocal Object)
  • شیء ایمیل ورودی (Input Email Object)
  • شیء آپلودفایل ورودی (Input FileUpload Object)
  • شیء پنهان‌سازی ورودی (Input Hidden Object)
  • شیء تصویر ورودی (Input Image Object)
  • شیء ماه ورودی (Input Month Object)
  • شیء عدد ورودی (Input Number Object)
  • شیء پسورد ورودی (Input Password Object)
  • شیء دامنهٔ ورودی (Input RangeObject)
  • شیء رادیویی ورودی (Input Radio Object)
  • شیء بازنشاندن ورودی (Input Reset Object)
  • شیء جستجوی ورودی (Input Search Object)
  • شیء ارسال ورودی (Input Submit Object)
  • شیء متن ورودی (Input Text Object)
  • شیء زمان ورودی (Input Time Object)
  • شیء URL ورودی (Input URL Object)
  • شیء هفتهٔ ورودی (Input Week Object)

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

ندارد.

منابع آموزشی