علامة <خيار> HTML
مثال
قائمة منسدلة بأربعة خيارات:
<label for="cars">Choose a car:</label>
<select id="cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="opel">Opel</option>
<option value="audi">Audi</option>
</select>
المزيد من الأمثلة "جربها بنفسك" أدناه.
التعريف والاستخدام
تحدد العلامة <option>
خيارًا في قائمة التحديد.
<option>
تدخل العناصر داخل عنصر <select> أو
<optgroup> أو <datalist> .
ملاحظة: يمكن <option>
استخدام العلامة بدون أي سمات ، لكنك تحتاج عادةً إلى سمة القيمة ، والتي تشير إلى ما يتم إرساله إلى الخادم عند إرسال النموذج.
نصيحة: إذا كانت لديك قائمة طويلة من الخيارات ، فيمكنك تجميع الخيارات ذات الصلة ضمن علامة <optgroup> .
دعم المتصفح
Element | |||||
---|---|---|---|---|---|
<option> | Yes | Yes | Yes | Yes | Yes |
صفات
Attribute | Value | Description |
---|---|---|
disabled | disabled | Specifies that an option should be disabled |
label | text | Specifies a shorter label for an option |
selected | selected | Specifies that an option should be pre-selected when the page loads |
value | text | Specifies the value to be sent to a server |
السمات العالمية
تدعم <option>
العلامة أيضًا السمات العامة في HTML .
سمات الحدث
تدعم <option>
العلامة أيضًا سمات الحدث في HTML .
مزيد من الأمثلة
مثال
استخدام <خيار> في عنصر <datalist>:
<label for="browser">Choose your browser from the list:</label>
<input list="browsers" name="browser" id="browser">
<datalist id="browsers">
<option value="Edge">
<option value="Firefox">
<option value="Chrome">
<option value="Opera">
<option value="Safari">
</datalist>
مثال
استخدام <خيار> في عناصر <مجموعة>:
<label for="cars">Choose a car:</label>
<select id="cars">
<optgroup label="Swedish Cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
</optgroup>
<optgroup label="German Cars">
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</optgroup>
</select>
الصفحات ذات الصلة
مرجع DOM HTML: كائن الخيار
إعدادات CSS الافتراضية
لا أحد.