أحدث البرامج التعليمية وتطوير الشبكة
 

مجموعة مختارة الخيارات

<اختر كائن

مثال

معرفة عدد خيارات هناك في القائمة المنسدلة محددة:

var x = document.getElementById("mySelect").options.length;

ونتيجة لالعاشر على النحو التالي:

4
انها محاولة لنفسك »

أكثر "Try it Yourself" الأمثلة أدناه.

تعريف والاستخدام

مجموعة خيارات بإرجاع مجموعة من كافة <option> العناصر في القائمة المنسدلة.

Note: يتم فرز العناصر في المجموعة كما تظهر في شفرة المصدر.

دعم المتصفح

مجموعة
options نعم فعلا نعم فعلا نعم فعلا نعم فعلا نعم فعلا

بناء الجملة

selectObject .options

الخصائص

خاصية وصف
length إرجاع عدد <option> عناصر في المجموعة.

ملاحظة: هذه الخاصية للقراءة فقط
selectedIndex مجموعات أو إرجاع مؤشر المحدد <option> عنصر في مجموعة (starts at 0)

أساليب

طريقة وصف
[ index ] إرجاع <option> عنصر من المجموعة مع الفهرس المحدد (starts at 0) .

ملاحظة: إرجاع فارغة إذا كان الرقم القياسي خارج النطاق
[ add( option [, index ]) ] يضيف <option> عنصر في مجموعة في الفهرس المحدد. إذا لم يتم تحديد مؤشر، فإنه يدرج الخيار في نهاية المجموعة
item( index ) إرجاع <option> عنصر من المجموعة مع الفهرس المحدد (starts at 0) .

ملاحظة: إرجاع فارغة إذا كان الرقم القياسي خارج النطاق
namedItem( id ) إرجاع <option> عنصر من مجموعة مع معرف المحدد.

ملاحظة: إرجاع فارغة حالة عدم وجود هوية
remove( index ) يزيل <option> عنصر مع الفهرس المحدد من مجموعة

تفاصيل تقنية

صفحة DOM: المستوى الأساسي كائن 2 الوثيقة
قيمة الإرجاع: كائن HTMLOptionsCollection، تمثل جميع <option> العناصر في <select> العنصر. يتم فرز العناصر في المجموعة كما تظهر في التعليمات البرمجية المصدر
أمثلة

مزيد من الأمثلة

مثال

[المؤشر]

الحصول على نص الخيار الأول (index 0) في القائمة المنسدلة:

var x = document.getElementById("mySelect").options[0].text;

ونتيجة لالعاشر على النحو التالي:

Apple
انها محاولة لنفسك »

مثال

item( index )

الحصول على نص الخيار الأول (index 0) في القائمة المنسدلة:

var x = document.getElementById("mySelect").options.item(0).text;

ونتيجة لالعاشر على النحو التالي:

Apple
انها محاولة لنفسك »

مثال

namedItem( id )

الحصول على نص الخيار مع معرف = "البرتقالي" في القائمة المنسدلة:

var x = document.getElementById("mySelect").options.namedItem("orange").text;

ونتيجة لالعاشر على النحو التالي:

Orange
انها محاولة لنفسك »

مثال

إضافة "Kiwi" الخيار في موضع فهرس "1" في القائمة المنسدلة:

var x = document.getElementById("mySelect");
var c = document.createElement("option");
c.text = "Kiwi";
x.options.add(c, 1);
انها محاولة لنفسك »

مثال

إزالة الخيار مع مؤشر "1" من القائمة المنسدلة:

var x = document.getElementById("mySelect");
x.options.remove(1);
انها محاولة لنفسك »

مثال

حلقة من خلال جميع الخيارات في القائمة المنسدلة، وإخراج النص من كل خيار:

var x = document.getElementById("mySelect");
var txt = "";
var i;
for (i = 0; i < x.length; i++) {
    txt = txt + x.options[i].text + "<br>";
}

وستكون النتيجة من النص على النحو التالي:

Apple
Orange
Pineapple
Banana
انها محاولة لنفسك »

مثال

إختيار أحد الخيارات في القائمة المنسدلة وإخراج النص من الخيار المحدد في عنصر مع معرف = "تجريبي":

var x = document.getElementById("mySelect");
var i = x.selectedIndex;
document.getElementById("demo").innerHTML = x.options[i].text;

والنتيجة يمكن أن يكون:

Banana
انها محاولة لنفسك »

مثال

تغيير الخيارات في القائمة المنسدلة اعتمادا على الخيار المحدد في القائمة المنسدلة آخر:

var carsAndModels = {};
carsAndModels['VO'] = ['V70', 'XC60', 'XC90'];
carsAndModels['VW'] = ['Golf', 'Polo', 'Scirocco', 'Touareg'];
carsAndModels['BMW'] = ['M6', 'X5', 'Z3'];

function ChangeCarList() {
    var carList = document.getElementById("car");
    var modelList = document.getElementById("carmodel");
    var selCar = carList.options[carList.selectedIndex].value;

    while (modelList.options.length) {
        modelList.remove(0);
    }

    var cars = carsAndModels[selCar];
    if (cars) {
        var i;
        for (i = 0; i < cars.length; i++) {
            var car = new Option(cars[i], i);
            modelList.options.add(car);
        }
    }
}
انها محاولة لنفسك »
<اختر كائن