تگ datalist در HTML
مثال (تگ datalist در HTML)
یک عنصر <input> با مقداری از پیش تعیین شده با عنصر <datalist>:
<input list="browsers">
<datalist id="browsers">
<option value="Internet Explorer">
<option value="Firefox">
<option value="Chrome">
<option value="Opera">
<option value="Safari">
</datalist>
<datalist id="browsers">
<option value="Internet Explorer">
<option value="Firefox">
<option value="Chrome">
<option value="Opera">
<option value="Safari">
</datalist>
خودتان امتحان کنید »
تعریف و کاربرد تگ datalist در HTML
تگ <datalist> یک لیست از گزینه های از قبل تعریف شده برای یک عنصر <input> مشخص می کند.
تگ <datalist> برای ارائه یک ویژگی "تکمیل خودکار" برای عنصر <input> استفاده می شود. بدین صورت که کاربران یک لیست کشویی از گزینه های از پیش تعریف شده در هنگام تکمیل فیلد، مشاهده می کنند.
شما می توانید با استفاده از یک عنصر <datalist>، لیست اجزای <input> را به هم متصل کنید.
پشتیبانی مرورگرها از تگ datalist در HTML
اعدادی که در جدول زیر مشخص شده، اولین نسخه ی مرورگرهایی است که به طور کامل از این عنصر پشتیبانی می کنند.
عنصر | |||||
---|---|---|---|---|---|
<datalist> | 20.0 | 10.0 | 4.0 | پشتیبانی نمی شود | 9.0 |
تفاوت بین HTML 4.01 و HTML5
تگ <datalist> یک تگ جدید در HTML5 است.
ویژگی های عمومی تگ datalist در HTML
تگ <datalist> از ویژگی های عمومی در HTML پشتیبانی می کند.
رویدادهای عمومی تگ datalist در HTML
تگ <datalist> از رویدادهای عمومی در HTML پشتیبانی می کند.
آموزش های مرتبط
مرجع اشیاء اچ تی ام ال: تگ datalist در JavaScript
- نوشته شده توسط سمیه فخری
- بازدید: 13016
دیدگاهها
سلام لطفا توضیح بدید
datalist با select فرقش چیه؟ اگه قرار باشه کاربر یک ایتم از بین چند ایتم برای سرچ انتخاب کنه کدوم یکی از این دوتا تگ کاربرد داره؟ممنون
لطفا توضیح بدید تفاوت تگ datalist و تگ select چیه؟
برای Select کاربر باید یکی از گزینه های موجود را انتخاب کند ولی برای datalist به کاربر پیشنهاد می شود یکی از گزینه های لیست را انتخاب کند در حالی که هر مقداری که بخواهد می تواند داخل فیلد input وارد کند.
بنابراین اینکه از کدوم استفاده کنیم بستگی به سناریو و نیاز شما داره. اگر کاربر باید مقداری را وارد کند از select استفاده کند اگر کاربر در درج گزینه ها مختار است از datalist.