تبلیغات متنی و بنر

آموزش HTML 5 > تگ های جدید فرم در HTML 5  >  تگ <datalist>

تگ <datalist> :

تگ <datalist> یک لیست از چند آیتم از پیش تعیین شده را برای یک کنترل <input> تعیین می کند . هدف از تعیین این تگ برای کنترل <input> تهیه یک لیست برای تکمیل اتوماتیک گزینه هاست.
به عبارت دیگر هنگامی که این تگ را برای یک کنترل تعیین می کنید ، در هنگام کلیک بر روی آن کنترل لیست آیتم ها بصورت یک منو به کاربر نمایش داده می شود .

از خاصیت List کنترل <input> برای اتصال آن به تگ <datalist> استفاده می شود .
نکته :هر آیتم تگ <datalist> توسط یک تگ <option> تعیین می شود .

شکل کلی استفاده از تگ <datalist>  بصورت زیر است :

syntax <input   list="datalist_id">

<datalist   id="datalist_id">
    <option value="value 1">
    <option value="value 2">
    <option value="value 3">
</datalist>

توضیح موارد syntax :

syntax توضیح
توضیح Parameter
یک id را برای تگ <datalist> تعیین می نماید . datalist_id
یک آیتم را برای تگ <datalist> ایجاد می نماید . option
مقدار هر آیتم تگ <datalist>  را تعیین می نماید . value

پشتیانی در مرورگر های مختلف :

این تگ در مرورگرهای کروم ، فایرفاکس و اپرا پشتیانی می شود .

مثال عملی :

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

Example
<form action="demo_form.asp" method="get">
     <input  list="browsers" name="browser">
     <datalist  id="browsers">
             <option value="Internet Explorer">
             <option value="Firefox">
             <option value="Chrome">
             <option value="Opera">
     </datalist>
     <input type="submit">
</form> 		کد
خروجی

راجع این مطلب سوال یا اشکالی دارید ؟! آن را در انجمن سایت مطرح نمایید ...         >>>>>  ورود به انجمن تخصصی

نظر خودتان درباره این صفحه را با ما در میان بگذارید  :

آیا مطالب این صفحه برای شما مناسب و مفید بود ه است :

نام :               
آدرس Email :  

نظر شما :  

سوال امنیتی : جمع سه + پنج چنده ؟