‎مجموعه گزينه هاي شئSelect

Previous >    <Next  

‎شئSelect كه مرتبط به عنصري از نوع‎<select>‎ ميشود ، داراي يك مجموعه ازاشياء Option‎كه مرتبط با عناصر نوع ‎<option>‎ ميباشند .مجموعه گزينه ها،مجموعه اي از ‎تمام عناصر‎<option>‎ را در يك ليست كشوئي برميگرداند .

‎مثال ـ پيدا نمودن تعداد گزينه هاي ليست كشوئي

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

--(go to editor for change code and run)

‎توجه ـ عناصر موجود در مجموعه ، همانوريكه در كد منبع تعريف شده اند، ظاهر ميشوند.

‎فرمت استفاده ـSyntax

‎فرمت استفاده شئ مجموعه
selectObject.options

‎ويژگي هاي شئ مجموعه گزينه ها

‎ويژگي ‎شرح
length ‎تعداد عناصر گرينه را در ليست كشوئي برگشت ميدهد.
selectedIndex ‎انديس عنصر‎<option>‎ انتجابي را تنظيم ويا برگشت ميدهد .

‎متدهاي شئ مجموعه

‎متد ‎شرح
[index] ‎گزييه را با انديس مشخص برگشت ميدهد.
‎انديس از صفر شروع ميشود.
[add(opion,[,index])] ‎گزينه اي را در انديس مشخص شده به ليست كشوئي اضافه ميكند.
‎اگر انديس مشخص نگردد بانتها اضافه ميشود.
item(index) ‎گزينه اي باانديس مشخص از ليست كشوئي برگشت ميدهد.
‎اگر انديس خارج از محدوده باشدnull برگشت ميشود .
namedItem(id) ‎گزينه باid مشخص شده اي را از ليست كشوئي برگشت ميدهد .
‎اگر شناسه گزينه وجود نداشته باشدnull برگشت ميشود .
remove(index) ‎گزينه باانديس مشخص را از ليست حذف ميكند.

‎مثالهاي بيشتر

‎مثال ـ‎[‎index‎]‎ دريافت متن اولين گزينه يعني انديس صفر كه نتيجه برگشتي Apple‎است

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

--(go to editor for change code and run)

‎مثال ـ‎item(‎item‎)‎ كه دريافت متن اولين گزينه

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

--(go to editor for change code and run)

‎دومتد فوق داراي دو فرمت مختلف ولي داراي عملكرد مشابه

‎مثال ـ‎namedItem(‎id‎)‎ دريافت متن گزينه اي با شناسه مشخص

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

--(go to editor for change code and run)

‎مثال ـ اضافه نمودن گرينه‎‎"Kiwi‎"‎ در انديس يك

var x = document.getElementById("mySelect");
var c = document.createElement("option");
c.text = "Kiwi";
x.options.add(c, 1);

--(go to editor for change code and run)

‎مثال ـ حذف گزينه باانديس يك

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

--(go to editor for change code and run)

‎مثال ـ ايجاد حلقه براي دريافت متن تمام گزينه هاي ليست كشوئي

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

--(go to editor for change code and run)

‎مثال ـ يگ گزينه از ليست كشوئي انتحاب كنيد وسپس متن آنرا به گزينه‎id="demo‎"‎ ‎منتقل نماييد.

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

--(go to editor for change code and run)

‎مثال ـ بسته به گزينه انتخاب شده درليست كشوئي ديكري،گزينه موجوددر يك ليست كشوئي ‎را تغيير دهيد.

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);
    }
  }
}

--(go to editor for change code and run)


Previous >    <Next