ড্রপডাউন তালিকার নির্বাচিত আইটেমের নম্বর
সিলেক্টগুলিতে একটি বিশেষ বৈশিষ্ট্য রয়েছে
selectedIndex, যা বর্তমানে নির্বাচিত
তালিকা আইটেমের নম্বর সংরক্ষণ করে।
এক্ষেত্রে নম্বর শুরু হয় শূন্য থেকে।
এই বৈশিষ্ট্যটি পড়া যেতে পারে,
আবার লেখাও যেতে পারে, তালিকার নির্বাচিত আইটেম পরিবর্তন করে।
একটি উদাহরণের মাধ্যমে এই বৈশিষ্ট্যের কাজ দেখি। ধরা যাক আমাদের নিম্নলিখিত ড্রপডাউন তালিকা দেওয়া আছে:
<select id="select">
<option value="one">এক</option>
<option value="two" selected>দুই</option>
<option value="three">তিন</option>
</select>
আসুন তালিকার নির্বাচিত আইটেমের নম্বর আউটপুট করি:
let select = document.querySelector('#select');
console.log(select.selectedIndex); // আউটপুট দেবে 1
এখন আসুন অন্য কোনো আইটেম নির্বাচন করি:
let select = document.querySelector('#select');
select.selectedIndex = 2; // 'তিন' নির্বাচন করবে
একটি ইনপুট এবং একটি সিলেক্ট দেওয়া আছে। ইনপুটে একটি সংখ্যা লেখা হয়। ফোকাস হারানোর সময় তালিকার সেই আইটেমটি নির্বাচিত করুন, যার নম্বর ইনপুটের মানের সমান।
সপ্তাহের দিনের নাম সহ একটি ড্রপডাউন তালিকা তৈরি করুন। এটি এমনভাবে সেটআপ করুন যাতে জাভাস্ক্রিপ্ট দ্বারা ডিফল্টভাবে এই তালিকায় বর্তমান দিনটি নির্বাচিত হয়।