آموزش تگ datalist در HTML - راهنمای کار با لیست با مقادیر از پیش تعیین شده در html

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

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

برای ایجاد ارتباط بین datalist و input، ابتدا با استفاده از خصیصه list تگ input نام لیست را تعریف کرده و سپس آن را درون خصیصه id تگ datalist قرار می دهیم.

مثال تگ datalist در HTML:

<input list="browsers" name="browser">
<datalist id="browsers">
<option value="Microsoft Edge">
<option value="Mozilla Firefox">
<option value="Google Chrome">
<option value="Opera">
<option value="Safari">
</datalist>

پشتیبانی مرورگرها

تگ <datalist> در مرورگرهای کروم 20، فایرفاکس 4، اپرا 9.5، سافاری 12.1، اینترنت اکسپلورر 10 به بالا پشتیبانی می شود.

مرورگر	کروم	فایرفاکس	اپرا	سافاری	اینترنت اکسپلورر / اج
پشتیبانی	20	4	9.5	12.1	10

پشتیبانی از ویژگی ها و رویدادهای عمومی

تگ <datalist> از ویژگی های عمومی و رویدادهای عمومی در HTML پشتیبانی می کند.

دستورات CSS پیش فرض

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

datalist {
display: none;
}

موضوع: آموزش HTML

کلمات کلیدی:

،

،

،

،

،

،

،

،

اچ تی ام ال

،

،

،

اشتراک گذاری:

لینک کوتاه:

نظرات نظرات تا اطلاع ثانوی غیر فعال است.

