مثال ها

نحو

1
<select name="name" required>
2
 <option value="1">John</option>
3
 <option value="2">Jane</option>
4
 <option value="3">Donald</option>
5
 <option value="4">Chuck</option>
6
 <option value="5">Leslie</option>
7
</select>

یک عنصر انتخابی با multiple ویژگی فعال (true) به چندین گزینه برای ارسال با ارسال فرم اجازه می دهد.

1
<select multiple name="name" required>
2
 <option value="1">John</option>
3
 <option value="2">Jane</option>
4
 <option value="3">Donald</option>
5
 <option value="4">Chuck</option>
6
 <option value="5">Leslie</option>
7
</select>

نتیجه

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

را select عنصر در تمام مرورگرهای مدرن پشتیبانی می شود. بیشتر در caniuse.com بخوانید.

نمایش مرورگرها select عناصر بسته به موتور رندر آنها متفاوت است. به این مثال نگاه کنید که همین را نشان می دهد select عنصر در گوگل کروم (طراحی شده توسط Blink)، فایرفاکس (طراحی شده توسط Quantum) و Safari (تجهیز شده توسط WebKit).

عناصر ارائه شده توسط مرورگرهای مختلف را انتخاب کنیدعناصر ارائه شده توسط مرورگرهای مختلف را انتخاب کنیدعناصر ارائه شده توسط مرورگرهای مختلف را انتخاب کنید
همه مرورگرهای اینجا در MacOS هستند

ویژگی های

آ select عنصر پشتیبانی می کند ویژگی های جهانی در HTML. مشخصه های جهانی برای همه عناصر HTML مشترک هستند و می توانند روی همه آنها استفاده شوند (اگرچه ممکن است تأثیر زیادی روی برخی از آنها نداشته باشند).

علاوه بر ویژگی های جهانی select عنصر دارای گروهی از ویژگی های دیگر است:

  • autocomplete: برای تکمیل خودکار فرم، ضربه بزنید.
  • disabled: اینکه آیا کنترل فرم غیرفعال است یا خیر.
  • form: همکاران select با یک form عنصر
  • multiple: اجازه دادن یا عدم اجازه دادن به مقادیر متعدد.
  • name: نام عنصر مورد استفاده برای ارسال فرم یا از طریق form.elements API.
  • required: آیا select برای ارسال فرم لازم است.
  • size: اندازه select.

محتوا

را select عنصر از صفر یا بیشتر پشتیبانی می کند گزینه، optgroup، و پشتیبانی از اسکریپت عناصر.

اگر انتخاب یک مقدار اختیاری است، ممکن است بخواهید یک مقدار خالی اضافه کنید <option> در بالای شما <select> عنصر

  • را <select> عنصر معمولاً در a یافت می شود <form>، اگرچه داشتن یک HTML کاملا معتبر است <select> در جای دیگر
  • را <select> عنصر بسیار شبیه به <datalist> عنصر، زیرا هر دو به کاربران چندگانه می دهند <option>را انتخاب کنید. با این حال، <datalist> بیشتر فهرستی از پیشنهادی گزینه ها، و کاربران در واقع می توانند مقدار خود را وارد کنند.

بیشتر بدانید