عناصر جدید برای فرم ها در HTML5

عناصر جدید برای فرم ها در HTML5

HTML5 چندین تگ و خصوصیت جدید برای فرم ها در نظر گرفته است.

• datalist
• keygen
• output

توجه: درست است که بعضی از مرورگرها از این انواع ورودی جدید پشتیبانی نمی کنند، ولی در صورت عدم پشتیبانی، با آن ها مثل ورودی های متنی ساده برخورد می کنند و مشکلی پیش نمی آید.

عنصر <datalist>

این عنصر لیستی از گزینه های از پیش تعریف شده را برای یک فیلد ورودی مهیا می کند.

زمانی که کاربر داده وارد می کند، یک لیست کشویی ظاهر می شود و می تواند از گزینه های پیشنهاد داده شده یکی را انتخاب نماید.

برای اتصال یک <datalist> به یک فیلد ورودی متنی، باید خاصیت list فیلد متنی را با id عنصر <datalist> تنظیم نمایید.

مثال (عناصر جدید برای فرم ها در HTML5)

<input list="browsers">

<datalist id="browsers">
  <option value="Internet Explorer">
  <option value="Firefox">
  <option value="Chrome">
  <option value="Opera">
  <option value="Safari">
</datalist>

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

عنصر <keygen>

هدف این عنصر مهیا کردن راهی مطمئن برای شناسایی کاربران است.

این عنصر یک تولید کننده جفت کلید است (key-pair generator).

وقتی یک فرم ارسال می شود، 2 کلید تولید می شود، یک کلید عمومی (public) و یک کلید خصوصی (private).

کلید خصوصی در کلاینت ذخیره می شود و کلید عمومی به سرور ارسال می شود. کلید عمومی می تواند برای ایجاد یک گواهی کلاینت برای شناسایی کاربر در آینده به کار رود.

مثال (عناصر جدید برای فرم ها در HTML5)

<form action="demo_keygen.asp" method="get">
Username: <input type="text" name="usr_name">
Encryption: <keygen name="security">
<input type="submit">
</form>

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

عنصر <output>

این عنصر برای انواع مختلف خروجی مثل نتیجه یک محاسبه ریاضی کاربرد دارد (شبیه زمانی که محاسبه بوسیله یک اسکریبت اجرا می شود عمل می کند).

مثال (عناصر جدید برای فرم ها در HTML5)

<form oninput="x.value=parseInt(a.value)+parseInt(b.value)">0
<input type="range" id="a" value="50">100 +
<input type="number" id="b" value="50">=
<output name="x" for="a b"></output>
</form>

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

• قبلی
• بعدی