این آموزش در تاریخ ۱۴۰۲/۰۶/۲۳ آپدیت شده است.
آموزش تگ option در HTML
سلام خدمت تمامی دوستان و همراهان محترم سایت آموزشی فری لرن ، امیدوارم که حال همگیتون خوب باشه. لطفا در ادامه با آموزش تگ option در HTML با من همراه باشید.
Free-Learn
آنچه در این جلسه میخوانید :
تگ Option در HTML
تگ option تگی است که با استفاده از آن میتوان گزینه ها ( آیتم های ) یک لیست را مشخص کرد.
تگ option در درون تگ های <select> و <datalist> و <optgroup> برای ایجاد گزینه ها یا در واقع همون آیتم های لیست مورد استفاده قرار میگیرد.
Free-Learn
مثال از تگ option در HTML
در ادامه میتوانید یک مثال از این تگ را مشاهده نمایید.
مثال شماره ۱ : استفاده در تگ select
|
1 2 3 4 5 6 7 8 9 10 11 |
<body> <select name="tarafdari"> <option value="Esteghlal">استقلال</option> <option value="Persepolis">پرسپولیس</option> <option value="Sepahan">سپاهان</option> <option value="Tractor">تراکتور</option> <option value="other">دیگر تیم ها</option> </select> </body> |
مثال شماره ۲ : استفاده در تگ datalist
|
1 2 3 4 5 6 7 |
<datalist id="browsers"> <option value="Microsoft Edge"> <option value="Mozilla Firefox"> <option value="Google Chrome"> <option value="Opera"> <option value="Safari"> </datalist> |
مثال شماره ۳ : استفاده در تگ optgroup
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
<select> <optgroup label="اسامی پسرونه"> <option value="sadegh">صادق</option> <option value="reza">رضا</option> <option value="alireza">علیرضا</option> <option value="mohsen">محسن</option> </optgroup> <optgroup label="اسامی دخترونه"> <option value="fateme">فاطمه</option> <option value="maryam">مریم</option> <option value="nazanin">نازنین</option> <option value="anna">آنا</option> </optgroup> </select> |
مثال شماره ۴ : استفاده از صفت selected ( برای انتخاب یک آیتم از لیست )
|
1 2 3 4 5 6 7 |
<select name="tarafdari"> <option value="Esteghlal">استقلال</option> <option value="Persepolis">پرسپولیس</option> <option value="Sepahan" selected>سپاهان</option> <option value="Tractor">تراکتور</option> <option value="other">دیگر تیم ها</option> </select> |
Free-Learn
پشتیبانی مرورگرها
در جدول زیر میتوانید مشاهده نمایید که آیا مرورگرهای اینترنتی از تگ option در HTML پشتیبانی میکنند یا خیر.
| نام مرورگر | Chrome | Firefox | Opera | Safari | Edge |
| پشتیبانی | بله | بله | بله | بله | بله |
Free-Learn
جدول صفات تگ option در HTML
در جدول زیر میتوانید صفات بهمراه مقادیری را که میتوان در این تگ استفاده کرد را مشاهده نمایید.
| نام صفت | مقدار | توضیح |
|---|---|---|
| disabled | disabled | برای غیرفعال کردن آیتم ها |
| label | text | برای مشخص کردن برچسب / لیبل برای آیتم ها |
| selected | selected | برای انتخاب کردن یک آیتم از لیست |
| value | text | یک مقدار برای تگ option ( جهت ارسال بسمت سرور ) |
Free-Learn
پشتیبانی از صفات و رویدادهای عمومی
تگ option از صفات عمومی و رویدادهای عمومی در HTML پشتیبانی می کند.
Free-Learn
نکات و توضیحات
- نکته یا توضیح خاصی وجود ندارد.
