تعریف و کاربرد تگ select در HTML
تگ <select> تگی است که با استفاده از آن می توان یک لیست کشویی ( لیست بازشو ) را ایجاد کرد.
همچنین با استفاده از تگ <option> نیز می توان آیتم ها یا گزینه های لیست کشویی را مشخص یا تعریف کرد.
- تگ <select> برای ایجاد یک لیست کشویی (drop-down) استفاده می شود.
- تگ <option> درون عنصر <select> گزینه های موجود در لیست را تعریف می کند.
مثال از تگ select در HTML
<select>
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</select>
تمرین کنید !
مثال شماره ۲ : لیستی که غیرفعال می باشد.
<select disabled>
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</select>
تمرین کنید !
مثال شماره ۳ : لیستی که قابلیت انتخاب بیش از چند گزینه را دارد. (برای انتخاب بیش از ۱ آیتم/گزینه باید دکمه Ctrl را از روی صفحه کلید نگه دارید سپس با ماوس گزینه ها را انتخاب نمایید)
<select multiple>
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</select>
تمرین کنید !
پشتیبانی مرورگرها از تگ select در HTML
Element | ![]() |
![]() |
![]() |
![]() |
![]() |
<select> | بله | بله | بله | بله | بله |
جدول صفات تگ select در HTML
نام صفت | مقدار | توضیح |
autofocus | autofocus | مشخص می کند که لیست بصورت پیش فرض به محض بالا آمدن صفحه برویش فوکوس شود. (یعنی در حالت انتخاب در می آید) |
disabled | disabled | مشخص می کند که لیست غیرفعال باشد. (رنگش بصورت خاکستری می شود) |
form | form_id | مشخص می کند که لیست متعلق به ۱ یا چندین فرم می باشد. |
multiple | multiple | قابلیت انتخاب همزمان چندین گزینه را در لیست مشخص می کند. برای انتخاب بیش از یک گزینه باید دکمه Ctrl را از روی صفحه کلید نگه دارید سپس با ماوس بروی گزینه های مورد نظرتان کلیک نمایید. |
name | name | یک نام را برای لیست مشخص می کند. |
required | required | مشخص می کند که انتخاب کردن حداقل یکی از گزینه های لیست ضروری می باشد. |
size | number | تعداد گزینه های قابل نمایش در لیست را مشخص می کند. |