jQuery ดึงค่าจาก SelectBox HTML ทำอย่างไร

สอนเขียน jQuery ดึงค่าจาก SelectBox ภาษา HTML บทความนี้แนะนำวิธีการดึงค่าจากแท็ก select ของภาษา HTML ด้วย jQuery Framework เพื่อนำค่าดังกล่าวที่ถูกเลือกทั้งหมดไปใช้งานต่อ สามารถเขียนโปรแกรมได้ดังนี้

ตัวอย่าง jQuery ดึงค่าจาก SelectBox HTML ทำอย่างไร

<select id="select">
    <option value="javascript">JavaScript</option>
    <option value="jquery">jQuery</option>
    <option value="html">HTML</option>
</select>

<script>
   $("#select").change(function(){
       let v = $(this).val();
       console.log( "คุณเลือก "+v );
   });
</script>

ผลลัพธ์

คุณเลือก jquery

jQuery ดึงค่าจาก SelectBox ของภาษา HTML ตัวอย่างอ้างถึง id=select เมื่อ SelectBox ถูกเลือกจะเกิดเหตุการณ์ change ขึ้นทำให้โปรแกรมเข้าไปทำงานในฟังก์ชัน โดยดึงค่าจาก SelectBox ที่ถูกเลือกโดยใช้คำสั่ง $(this).val() เก็บไว้ที่ตัวแปร v และแสดงผลลัพธ์ออกมาด้วยคำสั่ง console.log