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