آموزش HTML5: فرم های وب

مقدمه Introduction

• خوش آمدی Welcome

• با استفاده از پرونده های تمرینی Using the exercise files

• ابزارهای ضروری را نصب کنید Installing the essential tools

• استفاده از فرم های HTML5 در دنیای واقعی Using HTML5 Forms in the real world

1. مرور اجمالی فرم های HTML5 1. Overview of HTML5 Forms

• اشکال HTML5 جدید چیست؟ What's new in HTML5 Forms?

• نمای کلی از ویژگی های فرم های HTML5 جدید Overview of the new HTML5 Forms features

2. با استفاده از ویژگی ها و روش های جدید 2. Using the New Attributes and Methods

• تعیین یک قسمت فرم فعال فعال با استفاده از ویژگی فوکوس خودکار Designating a default active form field using the autofocus attribute

• پر کردن خودکار داده های قبلاً وارد شده با ویژگی خودکار Auto-filling previously entered data with the autocomplete attribute

• نمایش متن نگهدارنده در قسمتهای فرم Displaying placeholder text in form fields

• محدود کردن داده های زمینه فرم با یک عبارت معمولی با استفاده از ویژگی الگوی Constraining form field data with a regular expression using the pattern attribute

• دکمه های ارسال ارسال کنید که قوانین اعتبارسنجی را با استفاده از ویژگی novalidate دور می کنند Creating Submit buttons that bypass validation rules using the novalidate attribute

• تنظیم زمینه های مورد نیاز Setting required fields

• با استفاده از API های انتخاب متن Using the text selection APIs

• ساخت یک ظاهر طراحی CSS برای زمینه های نامعتبر ، معتبر و لازم Building CSS styling for invalid, valid, and required fields

3. قالب بندی زمینه ها با ویژگی های ورودی جدید 3. Formatting Fields with the New Input-Type Attributes

• ایجاد زمینه جستجو Creating a search field

• گرفتن آدرس ایمیل Capturing email addresses

• ایجاد فیلد آدرس وب Building a web address field

• ایجاد فیلد ورودی شماره تلفن Creating a phone number input field

• قالب بندی زمینه شماره Formatting number fields

• ایجاد زمینه برای گرفتن دامنه تعداد Creating fields for capturing number ranges

• ایجاد زمینه انتخاب تاریخ Building a date picker field

• برای ورودی فیلد از انتخابگر رنگ استفاده کنید Invoking the color picker for field input

4- با استفاده از عناصر فرم جدید 4. Using the New Form Elements

• ایجاد لیست ورودی های پیشنهادی با استفاده از عنصر datalist Creating a list of suggested entries using the datalist element

• استفاده از عنصر پیشرفت برای ایجاد نوار پیشرفت Using the progress element to create a progress bar

• اندازه گیری با عنصر متر را نشان می دهد Indicating measurements with the meter element

• نمایش نتایج حاصل از محاسبه با استفاده از عنصر خروجی Displaying the results of a calculation using the output element

5. نمونه هایی از فرم های HTML5 در دنیای واقعی 5. Real-World Examples of HTML5 Forms

• فرم های HTML5 و موبایل HTML5 Forms and mobile

• تبدیل یک فرم معمولی به فرم HTML5 Transforming an ordinary form into an HTML5 form

نتیجه Conclusion

• خداحافظ Goodbye