JavaScript ดึงข้อมูลจาก SelectBox หรือ Drop Down List

สอนเขียน JavaScript ดึงข้อมูลจาก SelectBox หรือ Drop Down List บทความนี้แนะนำการใช้คำสั่ง document.getElementById เพื่อดึงค่าจาก SelectBox ที่ถูกเลือก และแสดงผลลัพธ์ออกสู่หน้าจอ สามารถเขียนโปรแกรมได้ดังนี้

ตัวอย่าง JavaScript ดึงข้อมูลจาก SelectBox หรือ Drop Down List

<select id="language">
    <option value="JavaScript">JavaScript</option>
    <option value="HTML">HTML</option>
    <option value="CSS">CSS</option>
</select><br/>
<input type="button" onclick="getValue()" value="ดึงข้อมูลจาก SelectBox">

<script>
    function getValue() {
        let v = document.getElementById("language").value;
        console.log( "คุณเลือกภาษา "+v );
    }
</script>

ผลลัพธ์

คุณเลือกภาษา JavaScript

JavaScript ดึงข้อมูลจาก SelectBox แนะนำให้ใช้คำสั่ง document.getElementById โดยอ้างถึง id ของแท็ก select คือ language และใช้คำสั่ง value เพื่อดึงค่าจากแท็ก select ที่ถูกเลือก