العنصر <datalist>

من موسوعة حسوب
اذهب إلى: تصفح، ابحث

يحتوي العنصر <datalist> على عناصر <option> التي تُمثِّل القيم المتوافرة لعناصر النماذج الأخرى.

مثال عن تعريف العنصر <datalist> مع خاصية id، مع تعريف أكثر من خيار باستخدام العنصر <option>، وإسناد هذه القائمة إلى عنصر <input> عبر الخاصية list:

<label>اختر متصفحك من القائمة:
<input type="text" list="browsers" name="myBrowser"></label>
<datalist id="browsers">
  <option value="Chrome">
  <option value="Firefox">
  <option value="Internet Explorer">
  <option value="Opera">
  <option value="Safari">
  <option value="Microsoft Edge">
</datalist>

بطاقة العنصر

تصنيفات المحتوى عنصر تنظيمي وعنصر عادي.
المحتوى المسموح المحتوى العادي أو العنصر <option> صفر مرة أو أكثر.
الوسم المختصر لا يمكن حذف أيّ من وسمَي البداية أو النهاية.
العناصر الأب أي عنصر يقبل المحتوى العادي.
واجهة DOM HTMLDataListElement

دعم المتصفحات

Chrome Firefox Edge Safari Opera
20 4.0 مدعوم غير مدعوم 9.5

الخاصيات

يمكن استخدام الخاصيات العامة في هذا العنصر.

التنسيق الافتراضي

أغلبية المتصفحات تخفي العنصر <datalist> بضبط الخاصية display إلى none:
datalist {
  display: none;
}

مصادر ومواصفات