تعریف و کاربرد
تگ <datalist> برای ساخت یک لیست از پیش تعریف شده برای تگ های <input> استفاده می شود.
<datalist> ها از قابلیت autocomplete استفاده می کنند. لیست ایجاد شده به صورت کشویی نمایش داده می شود.
برای مشخص کردن مقادیر لیست، از تگ <option> با ویژگی value استفاده می شود.
<option value="first value">برای اتصال <datalist> به <input> باید:
- در تگ <datalist> ویژگی id را اضافه کرده و برای آن اسمی می گذاریم.
- در تگ <input> ویژگی list را اضافه کرده و اسم لیست مورد نظر را در آن وارد می کنیم.
<input list="ages" name="age">
<datalist id="ages">
<option value="7-12">
<option value="12-18">
<option value="18-30">
<option value="30-40">
<option value="+40">
</datalist>سازگاری با مرورگر
| # | کروم | ادج | فایرفاکس | سافاری | اپرا |
|---|---|---|---|---|---|
| <datalist> |
ویژگی های سراسری
تگ <datalist> از ویژگی های سراسری HTML پشتیبانی می کند.
ویژگی های رویداد
تگ <datalist> از ویژگی های رویداد HTML پشتیبانی می کند.
استایل css پیش فرض
بیشتر مرورگر ها تگ <datalist> را با استایل پیشفرض زیر نمایش می دهند:
