ให้เรตสมาชิก: 2 / 5

ดาวใช้งานดาวใช้งานดาวไม่ได้ใช้งานดาวไม่ได้ใช้งานดาวไม่ได้ใช้งาน
 

 

     Radio Button คือ GUI Widget (โปรแกรมขนาดเล็กหรือการใช้ภาพประสานกับผู้ใช้โดยผ่านคอมพิวเตอร์ เช่น CheckboxText, Boxlink ) โดย Radio Button เป็นปุ่มเลือกที่ผู้ใช้งานสามารถเลือกได้แค่ตัวเลือกเดียวถ้ากำหนดชื่อของปุ่มชื่อเดียวกัน ไม่สามารถเลือกได้หลายตัวเลือก จะอยู่ในรูปแบบของวงกลมพื้นที่ว่าง ถ้าผู้ใช้ต้องการเลือก สามารถกดที่พื้นที่ว่างในวงกลมนั้นแล้วจะมีจุดสีดำขึ้นในกลมถือว่าผู้ใช้ได้ทำการเลือกปุ่มนั้นแล้ว โดย Checkbox กับ Radio Button คล้ายกันแต่จะแตกต่างกันอยู่คือ  รูปร่างที่ Checkbox จะเป็นสี่เหลี่ยมและ Checkbox สามารถเลือกได้หลายตัวเลือก

 

ตัวอย่างโค้ด

<div class="input-group">
   <span class="input-group" id="basic-addon">อาหารชนิดที่ 1</span>
   <span class="input-group"><input type="radio" name="m1" value=" % / เดือน" id="1" onclick="myFunction('1')" checked>ของหวาน</span>
   <span class="input-group"><input type="radio" name="m1" value=" % / ปี" id="2" onclick="myFunction('2')">ของคาว<br></span>      
</div>
<br/>  
<div class="input-group">
   <span class="input-group" id="basic-addon">อาหารชนิดที่ 2</span>
   <span class="input-group"><input type="radio" name="m2" value=" เดือน" id="3" onclick="myFunction('3')" checked>ของหวาน1</span>
   <span class="input-group"><input type="radio" name="m2" value=" ปี"  id="4" onclick="myFunction('4')">ของคาว2<br></span>
</div>
<br/>                                      
<script>
   function myFunction(p) {
   if(p==1){
   document.getElementById("3").checked = true;
   }
   if(p==3){
   document.getElementById("1").checked = true;
   }
   if(p==2){
   document.getElementById("4").checked = true;
   }
   if(p==4){
   document.getElementById("2").checked = true;
   }
   }
</script>

 

ผลลัพธ์

 

เมื่อเลือกของหวาน หรือของหวาน 1

 

เลือกของหวาน
เลือกของหวาน

 

เมื่อเลือกของคาว หรือของคาว 2

 

เลือกของคาว
เลือกของคาว

 

อธิบาย

    เมื่อผู้ใช้งานเลือก ของหวาน แล้วจะไม่สามารถเลือก ของคาว 1 ได้ เช่นเดียวกัน ถ้าเลือก ของคาว 2 จะไม่สามารถเลือกของหวาน (ผู้ใช้เลือกของหวาน จะเลือกของหวาน 1 ให้อัตโนมัติ)

    เมื่อผู้ใช้งานเลือก ของคาว แล้วจะไม่สามารถเลือก ของหวาน 1 ได้ เช่นเดียวกัน ถ้าเลือก ของหวาน 1 จะไม่สามารถเลือกของคาว  (ผู้ใช้เลือกของคาว จะเลือกของคาว 2 ให้อัตโนมัติ)

 

อ้างอิง : w3schools 

 

ข่าวสารเพิ่มเติมเกี่ยวกับ PHP

กระทู้ล่าสุดจากเว็บบอร์ด
หัวข้อกระทู้
ตอบ
เปิดดู
ล่าสุด
วิธีใส่เสียงประกอบด้วย ลงในวีดีโอ ด้วย DaVinci Resolve 16
โดย nai_cyp จ 17 ส.ค. 2020 5:53 pm บอร์ด Graphic design
0
86
จ 17 ส.ค. 2020 5:53 pm โดย nai_cyp
สอบถามโปรแกรมอัดหน้าจอ (Windows)
โดย nai_cyp จ 17 ส.ค. 2020 1:16 pm บอร์ด ถาม - ตอบ คอมพิวเตอร์
1
196
จ 17 ส.ค. 2020 1:17 pm โดย thatsawan
วิธีใส่ข้อความในวิดีโอด้วย DaVinci Resolve 16
โดย nai_cyp จ 17 ส.ค. 2020 10:37 am บอร์ด Graphic design
0
94
จ 17 ส.ค. 2020 10:37 am โดย nai_cyp
วิธีเบลอวิดีโอด้วย DaVinci Resolve 16
โดย nai_cyp อ 16 ส.ค. 2020 5:33 am บอร์ด Graphic design
0
79
อ 16 ส.ค. 2020 5:33 am โดย nai_cyp
การต่อวิดีโอด้วย DaVinci Resolve 16
โดย nai_cyp อ 16 ส.ค. 2020 5:07 am บอร์ด Graphic design
0
69
อ 16 ส.ค. 2020 5:07 am โดย nai_cyp
วิธีตัดวิดีโอด้วย DaVinci Resolve 16
โดย nai_cyp อ 16 ส.ค. 2020 4:50 am บอร์ด Graphic design
0
99
อ 16 ส.ค. 2020 4:50 am โดย nai_cyp
ติดตั้ง Joomla บน ubuntu ไม่ได้ค่ะ
โดย bolue ส 15 ส.ค. 2020 6:35 pm บอร์ด ปัญหาการใช้ phpBB3, SMF, Joomla, Wordpress, CMS, CRM
6
168
จ 17 ส.ค. 2020 10:50 am โดย bolue
การใส่ เมนู ใน editor ของ mindphp ไม่ขึ็นข้อมูล
โดย bolue ส 15 ส.ค. 2020 10:14 am บอร์ด ปัญหาการใช้ phpBB3, SMF, Joomla, Wordpress, CMS, CRM
0
108
ส 15 ส.ค. 2020 10:14 am โดย bolue
Joomla 4 beta 3 มาแล้ว มีอะไรใหม่ บ้างมาดูกัน
โดย mindphp ศ 14 ส.ค. 2020 2:12 pm บอร์ด MindPHP News & Feedback
0
109
ศ 14 ส.ค. 2020 2:12 pm โดย mindphp
การใช้ try-catch จับ Exception ในภาษา Java
โดย nai_cyp พฤ 13 ส.ค. 2020 2:47 pm บอร์ด Share Knowledge
0
79
พฤ 13 ส.ค. 2020 2:47 pm โดย nai_cyp
การใช้ switch ในภาษา Java
โดย nai_cyp พฤ 13 ส.ค. 2020 2:45 pm บอร์ด Share Knowledge
0
77
พฤ 13 ส.ค. 2020 2:45 pm โดย nai_cyp
การใช้คำสั่ง break และ continue ในภาษา Java
โดย nai_cyp พฤ 13 ส.ค. 2020 2:44 pm บอร์ด Share Knowledge
0
72
พฤ 13 ส.ค. 2020 2:44 pm โดย nai_cyp
การใช้ Do-While loop ในภาษา Java
โดย nai_cyp พฤ 13 ส.ค. 2020 1:37 pm บอร์ด Share Knowledge
0
91
พฤ 13 ส.ค. 2020 1:37 pm โดย nai_cyp
การใช้ For-loop ในภาษา Java
โดย nai_cyp พฤ 13 ส.ค. 2020 1:36 pm บอร์ด Share Knowledge
0
79
พฤ 13 ส.ค. 2020 1:36 pm โดย nai_cyp
การใช้ While-loop ในภาษา Java
โดย nai_cyp พฤ 13 ส.ค. 2020 1:33 pm บอร์ด Share Knowledge
0
89
พฤ 13 ส.ค. 2020 1:33 pm โดย nai_cyp
โปรแกรมตัดต่อ VDO ที่ฟรี บน windows
โดย nai_cyp พฤ 13 ส.ค. 2020 11:35 am บอร์ด Share Knowledge
2
114
พฤ 13 ส.ค. 2020 12:36 pm โดย nai_cyp
สร้าง crontab ใน Directadmin แล้ว Error Error Creating Cron Job
โดย mindphp พ 12 ส.ค. 2020 5:08 am บอร์ด Linux - Web Server
1
142
พ 12 ส.ค. 2020 5:17 am โดย mindphp
Undertaker เปิดตัวด้วยเพลงของ Metalica (ดนตรี)
โดย nai_cyp อ 11 ส.ค. 2020 5:20 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
1
98
จ 24 ส.ค. 2020 10:53 am โดย Sirayu
Green Day ปล่อยเพลงใหม่ช่วง COVID-19 (ดนตรี)
โดย nai_cyp อ 11 ส.ค. 2020 5:16 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
1
83
จ 24 ส.ค. 2020 10:54 am โดย Sirayu
BLACKPINK โปสเตอร์ทีเซอร์ใหม่? (ดนตรี)
โดย nai_cyp อ 11 ส.ค. 2020 5:11 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
1
83
จ 24 ส.ค. 2020 10:54 am โดย Sirayu