تگ option در HTML

در این مقاله با تگ option در HTML آشنا می شویم.

نکات اصلی تگ option

• <option> گزینه های احتمالی را در یک منوی کشویی مشخص می کند.
• تگ <option> با عنصر <select> همکاری می کند و یک منوی کشویی برای انتخاب پاسخ توسط کاربران ایجاد می کند.
• اگر لیست گزینه ها شامل بسیاری از پاسخ های پیشنهادی است ، بهتر است آن ها را به گروه های <optgroup> تقسیم کنید.

هدف تگ option در HTML

تگ <option> در HTML پاسخ های پیشنهادی را در لیست عناصر <select> تنظیم می کند.

<p>Which pet would you like to keep at home?</p>
  <select>
  <option value="cat">Cat</option>
  <option value="wolf">Wolf</option>
  <option value="llama">Llama</option>
</select>

ویژگی های تگ option

selected

با استفاده از ویژگی selected ، به محض باز شدن لیست ، یک گزینه خاص HTML انتخاب کنید.

<p>Which pet would you like to keep at home?</p>
  <select>
  <option value="cat">Cat</option>
  <option value="wolf">Wolf</option>
  <option value="llama" selected>Llama</option>
</select>

disabled

 وقتی تگ <option> در HTML دارای ویژگی disabled باشد ، این گزینه قابل بررسی نیست.

<p>Which pet would you like to keep at home?</p>
  <select>
  <option value="cat" disabled>Cat</option>
  <option value="wolf">Wolf</option>
  <option value="llama">Llama</option>
</select>

label

HTML option label نام کوتاهتری برای یک گزینه تعریف می کند. گزینه نهایی لیست HTML شامل نسخه کوتاه شده است.

<p>Which pet would you like to keep at home?</p>
  <select>
  <option label="Cat">Cat - the tiger of the house</option>
  <option label="Dog">Dog - best friend of the cat</option>
  <option label="Llama">Llama - just fabulous</option>
</select>

value

هنگامی که تگ <option> در HTML دارای ویژگی value است ، این نشان دهنده پاسخی است که برای ارسال به یک سرور ارسال می شود (پس از انتخاب گزینه).

<p>Which pet would you like to keep at home?</p>
  <select>
  <option value="cat">Cat</option>
  <option value="wolf">Wolf</option>
  <option value="llama">Llama</option>
</select>

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

این تگ در مرورگرهای : IE، safari ، firefox، cherom، opera  و Edge پشتیبانی می شود.

در دوره آموزش HTML بین المللی آکادمی دویکس به صورت رایگان ثبت نام کنید.