Select options সমস্ত
অর্থনীতি ও পরিচালনা
options সমস্ত নাম্বর সূচীতে ফিরিয়ে দেয় option উপাদান এর সংকলন।
মন্তব্য:সংকলনের এলাকা তাদের সূত্রকোডের বিন্দুস্থানে যেভাবে তারা ব্যবহৃত হয়েছে তেমনই ক্রমানুসারে ক্রমায়িত হয়েছে।
প্রতিদর্শন
উদাহরণ 1
নির্দিষ্ট নাট্যপটলিস্তিতে কতটি বিকল্প আছে দেখুন:
var x = document.getElementById("mySelect").options.length;
x এর ফলাফল হবে:
4
পরামর্শ:পানের নিচে আরও উদাহরণ পাওয়া যাবে。
ব্যবহারকৌশল
selectObject.options
বৈশিষ্ট্য
| বৈশিষ্ট্য | বর্ণনা |
|---|---|
| length |
সংকলনে <option> এলাকার সংখ্যা ফিরিয়ে দেয়। মন্তব্য:এই বৈশিষ্ট্যটি অবলম্বনীয় হয় |
| selectedIndex | সংকলনের নির্বাচিত <option> এলাকার সূচক (0 থেকে শুরু করে) সংজ্ঞায়িত করা অথবা ফিরিয়ে দিন। |
পদ্ধতি
| পদ্ধতি | বর্ণনা |
|---|---|
| [index] |
সংকলন থেকে নির্দিষ্ট সূচক (0 থেকে শুরু করে) এর <option> এলাকা ফিরিয়ে দেয়। মন্তব্য:যদি সূচক নির্দিষ্ট হয়নি, তবে null ফিরিয়ে দেয়। |
| [add(option[,index] | নির্দিষ্ট সূচকে সংকলনে <option> এলাকা যোগ করুন।যদি নির্দিষ্ট সূচক না হলে, তবে সংকলনের শেষে বিকল্প যোগ করা হবে。 |
| item(index) |
সংকলন থেকে নির্দিষ্ট সূচক (0 থেকে শুরু করে) এর <option> এলাকা ফিরিয়ে দেয়। মন্তব্য:যদি সূচক নির্দিষ্ট হয়নি, তবে null ফিরিয়ে দেয়। |
| namedItem(id) |
সংকলন থেকে নির্দিষ্ট ID-র <option> এলাকা ফিরিয়ে দেয়। মন্তব্য:যদি id যদি না থাকলে null ফিরিয়ে দেয়। |
| remove(index) | সংকলন থেকে নির্দিষ্ট সূচকের <option> এলাকা সরিয়ে নিন। |
প্রযুক্তিগত বিবরণ
| DOM সংস্করণ: | Core Level 2 Document Object |
|---|---|
| ফলাফল: |
HTMLOptionsCollection একটি অবজেক্ট, যা <select> এলাকার সকল <option> এলাকাকে প্রতিনিধিত্ব করে। সংকলনের এলাকা তাদের সূত্রকোডের বিন্দুস্থানে যেভাবে তারা ব্যবহৃত হয়েছে তেমনই ক্রমানুসারে ক্রমায়িত হয়েছে। |
আরও উদাহরণ
উদাহরণ 2: [index]
নাট্যপটলিস্তিতে প্রথম বিকল্প (সূচক 0) এর টেক্সট পাওয়া নিয়ে আসুন:
var x = document.getElementById("mySelect").options[0].text;
x এর ফলাফল হবে:
এপল
উদাহরণ 3: item(index)
নাট্যপটলিস্তিতে প্রথম বিকল্প (সূচক 0) এর টেক্সট পাওয়া নিয়ে আসুন:
var x = document.getElementById("mySelect").options.item(0).text;
x এর ফলাফল হবে:
এপল
উদাহরণ 4: namedItem(id)
নাট্যপটলিস্তিতে id="orange"-র বিকল্পের টেক্সট পাওয়া নিয়ে আসুন:
var x = document.getElementById("mySelect").options.namedItem("orange").text;
x এর ফলাফল হবে:
অরেঞ্জ
উদাহরণ 5
নাট্যপটলিস্তির বিন্দুস্থান “1”-এ “Kiwi” বিকল্প যোগ করুন:
var x = document.getElementById("mySelect");
var c = document.createElement("option");
c.text = "Kiwi";
x.options.add(c, 1);
উদাহরণ 6
ড্রপডাউন লিস্ট থেকে সূচক '1' এর অপশন মুক্ত করুন:
var x = document.getElementById("mySelect"); x.options.remove(1);উদাহরণ 7
ড্রপডাউন লিস্টের সকল অপশন পরিবর্তন করে এবং প্রত্যেক অপশনের টেক্সট প্রদর্শন করুন:
var x = document.getElementById("mySelect");
var txt = "";
var i;
for (i = 0; i < x.length; i++) {
txt = txt + x.options[i].text + "<br>";
}
x এর ফলাফল হবে:
এপল অরেঞ্জ পাইন্যাপপল বানানা
উদাহরণ 8
ড্রপডাউন লিস্টে একটি অপশন নির্বাচন করুন, এবং id="demo" এর ইলেকট্রনের মধ্যে নির্বাচিত অপশনের টেক্সট প্রদর্শন করুন:
var x = document.getElementById("mySelect");
var i = x.selectedIndex;
document.getElementById("demo").innerHTML = x.options[i].text;
x এর ফলাফল হবে:
বানানা
উদাহরণ 9
অন্য ড্রপডাউন লিস্টের নির্বাচিত অপশন অনুযায়ী ড্রপডাউন লিস্টের অপশন পরিবর্তন করুন:
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);
}
}
}
