آموزش تگ option در HTML

آموزش تگ option در HTML

تگ <option> در HTML برای تعریف گزینه‌های مختلف در یک لیست انتخابی (<select>) استفاده می‌شود. این گزینه‌ها اطلاعاتی را که کاربر می‌تواند از آن‌ها انتخاب کند، نمایش می‌دهند. در این مقاله، تمامی ویژگی‌ها و حالت‌های تگ <option> را بررسی خواهیم کرد و با مثال‌های عملی آن‌ها را توضیح می‌دهیم.

1. تگ option در HTML

تگ <option> برای تعریف یک گزینه در یک لیست انتخابی (<select>) استفاده می‌شود. این تگ شامل متن یا مقداری است که کاربر می‌تواند انتخاب کند.

<select>
   <option value="1">گزینه 1</option>
   <option value="2">گزینه 2</option>
   <option value="3">گزینه 3</option>
</select>

2. ویژگی‌های تگ option

2.1. value

این ویژگی مقدار واقعی گزینه را مشخص می‌کند که به سرور ارسال می‌شود.

<option value="male">مرد</option>
<option value="female">زن</option>

2.2. selected

این ویژگی مشخص می‌کند که آیا گزینه به صورت پیش‌فرض انتخاب شده است یا خیر.

<option value="volvo" selected>ولوو</option>
<option value="saab">ساب</option>

3. مثال کامل

<select>
   <option value="volvo">ولوو</option>
   <option value="saab">ساب</option>
   <option value="opel">اپل</option>
   <option value="audi">آئودی</option>
</select>

در این مثال، یک لیست انتخابی با چهار گزینه مختلف از خودروها نشان داده شده است. کاربر می‌تواند یکی از این گزینه‌ها را انتخاب کند.

تگ <option> در HTML برای ایجاد لیست‌های انتخابی در فرم‌های وبسایت استفاده می‌شود. با استفاده از این تگ، کاربران می‌توانند یکی از گزینه‌های موجود را انتخاب کنند و اطلاعات مورد نیاز را به سرور ارسال کنند.

پست های مرتبط

مطالعه این پست ها رو از دست ندین!
JavaScript - رویدادها (Events)

JavaScript – رویدادها (Events)

رویدادهای HTML رویدادها در HTML، “اتفاقاتی” هستند که برای عناصر HTML رخ می‌دهند. این اتفاقات می‌توانند ناشی از کار...

بیشتر بخوانید
JavaScript - سازنده‌های شیء (Object Constructors)

JavaScript – سازنده‌های شیء (Object Constructors)

ساخت آبجکت با تابع سازنده (Object Constructor Function) برای ساخت چندین آبجکت مشابه، از تابع سازنده استفاده می‌شود. این...

بیشتر بخوانید
JavaScript - نمایش شیء (Object Display)

JavaScript – نمایش شیء (Object Display)

نحوه نمایش آبجکت‌ها در جاوااسکریپت هنگام نمایش یک آبجکت جاوااسکریپت به صورت مستقیم، خروجی معمولاً به شکل [object Object]...

بیشتر بخوانید

نظرات

سوالات و نظراتتون رو با ما به اشتراک بذارید

برای ارسال نظر لطفا ابتدا وارد حساب کاربری خود شوید.