JavaScript တွင် ရွေးချယ်စာရင်းများနှင့် အလုပ်လုပ်ခြင်း

ဤသင်ခန်းစာတွင် ရွေးချယ်စာရင်း တစ်ခုကို ကိုယ်စားပြုသော select tag နှင့် အလုပ်လုပ်ပုံကို လေ့လာပါမည်။ HTML တွင် ဤ tag နှင့် အလုပ်လုပ်နည်း မသိသေးပါက၊ အရင်ဆုံး အောက်ပါလင့်ခ်ရှိ လမ်းညွှန်စာအုပ်တွင် ၎င်း၏ တည်ဆောက်ပုံကို လေ့လာပါ: select။

JavaScript မှတစ်ဆင့် ဤ tag နှင့် အလုပ်လုပ်နည်းကို ကြည့်ရအောင်။ ကျွန်ုပ်တို့တွင် အောက်ပါ ရွေးချယ်စာရင်း တစ်ခု ရှိသည်ဟု ဆိုကြပါစို့:

<select id="select">
	<option>one</option>
	<option selected>two</option>
	<option>three</option>
</select>

select ကို variable တစ်ခုအတွင်း ရယူကြပါစို့:

let select = document.querySelector('#select');

အခု select ပြောင်းလဲသွားသောအခါ စာရင်းထဲမှ ရွေးချယ်ထားသောအချက်၏ စာသားကို စခရင်ပေါ်တွင် ထုတ်ပြကြည့်ပါစို့။ ထိုသို့ပြုလုပ်ရန် ကျွန်ုပ်တို့၏ select ၏ value property ကို ဖတ်ရန် လိုအပ်သည်:

select.addEventListener('change', function(){
	console.log(this.value);
});

Select တစ်ခု၊ စာပိုဒ်တစ်ခုနှင့် ခလုတ်တစ်ခု ရှိသည်။ ခလုတ်ကို ကလစ်နှိပ်သောအခါ ရွေးချယ်ထားသော စာရင်းအချက်၏ စာသားကို စာပိုဒ်ထဲတွင် ထုတ်ပြပါ။

�ှစ် 2020 မှ 2030 အထိ ရွေးချယ်စာရင်း တစ်ခု ပြုလုပ်ပါ။ စာရင်းထဲမှ အချက်တစ်ခုခု ရွေးချယ်သောအခါ ထိုနှစ်သည် ရက်ထပ်နှစ် ဟုတ်မဟုတ် သတင်းစကား တစ်ခု ထုတ်ပြပါ။