ให้เรตสมาชิก: 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

กระทู้ล่าสุดจากเว็บบอร์ด
หัวข้อกระทู้
ตอบ
เปิดดู
ล่าสุด
อยากทราบวิธีการที่ที่จะส่งค่าเมนู tools ไปเเสดงบน part way ของ phpbb
โดย Ittichai_chupol อ 05 พ.ย. 2019 10:35 am บอร์ด Programming - PHP
1
23
อ 05 พ.ย. 2019 10:38 am โดย thatsawan
งานประจำวันที่ 5 พฤศจิกายน 2562
โดย numtan5839 อ 05 พ.ย. 2019 10:13 am บอร์ด M097 - ตรีเนตร บูรณโพธิ์ทอง
1
12
อ 05 พ.ย. 2019 6:04 pm โดย numtan5839
สอบถามการตั้งค่าใบปริ้นปะหน้าซองในระบบERP ให้มีเลขที่สาขาย่อย ต้องทำยังไงคะ
โดย nnamfon.26 อ 05 พ.ย. 2019 10:03 am บอร์ด OpenERP - MD-ERP (Main)
3
11
พฤ 07 พ.ย. 2019 6:35 pm โดย mindphp
เครื่องวัดอุณหภูมิร่างกายสำหรับวัดไข้
โดย LEG อ 05 พ.ย. 2019 9:58 am บอร์ด Share Knowledge
0
14
อ 05 พ.ย. 2019 9:58 am โดย LEG
insert ข้อมูล แบบ array ลงฐานข้อมูล
โดย bankjittapol จ 04 พ.ย. 2019 11:27 pm บอร์ด PHP Knowledge
0
41
จ 04 พ.ย. 2019 11:27 pm โดย bankjittapol
การสร้าง foreign key ใน MySQL ด้วย phpmyadmin สำหรับ ตารางที่เป็น innodb
โดย bankjittapol จ 04 พ.ย. 2019 10:57 pm บอร์ด SQL Knowledge
1
500
อ 05 พ.ย. 2019 3:19 am โดย mindphp
4 กลยุทธ์ที่จะช่วยให้ธุรกิจประสบผลสำเร็จ (4PS)
โดย numtan5839 จ 04 พ.ย. 2019 5:54 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
1
55
พ 06 พ.ย. 2019 2:33 pm โดย numtan5839
ทำให้ช่องทั้งสองขึ้นเป็นปีให้เลือกได้ทั้
โดย mstsksmstsks จ 04 พ.ย. 2019 5:16 pm บอร์ด HTML CSS
1
57
จ 04 พ.ย. 2019 5:17 pm โดย mstsksmstsks
6 จุดเช็กอินในเชียงใหม่ หน้าหนาวนี้ ต้องไปเยือน
โดย Meygrand จ 04 พ.ย. 2019 4:46 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
28
จ 04 พ.ย. 2019 4:46 pm โดย Meygrand
ทดสอบ
โดย mindphp จ 04 พ.ย. 2019 4:40 pm บอร์ด Programming - PHP
0
70
จ 04 พ.ย. 2019 4:40 pm โดย mindphp
แหล่งท่องเที่ยวในจังหวัดสุพรรณบุรี
โดย numtan5839 จ 04 พ.ย. 2019 4:00 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
1
66
พ 06 พ.ย. 2019 2:36 pm โดย numtan5839
การสร้างปีภาษีสำหรับการบัญทึกบัญชี
โดย nnamfon.26 จ 04 พ.ย. 2019 3:36 pm บอร์ด ถาม - ตอบ ธุรกิจ กฏหมาย ภาษี บัญชี
0
24
จ 04 พ.ย. 2019 3:36 pm โดย nnamfon.26
รวมรายการลดหย่อนภาษี ปี 62 แค่วางแผนให้ดี ก็มีเงินเหลือแน่นอน!
โดย promotion จ 04 พ.ย. 2019 3:35 pm บอร์ด ถาม - ตอบ ธุรกิจ กฏหมาย ภาษี บัญชี
0
31
จ 04 พ.ย. 2019 3:35 pm โดย promotion
อยากทราบวิธีการส่งค่าเมนู ไปแสดงที่ part way ของ phpbb
โดย Ittichai_chupol จ 04 พ.ย. 2019 3:02 pm บอร์ด Programming - PHP
1
27
จ 04 พ.ย. 2019 3:09 pm โดย thatsawan
วิธีการใช้ textwarp เพื่อทำการนำข้อความที่ยาวเกินไปมาขึ้นบรรทัดใหม่
โดย jirawoot จ 04 พ.ย. 2019 2:57 pm บอร์ด Python Knowledge
0
45
จ 04 พ.ย. 2019 2:57 pm โดย jirawoot
ต้องการ เลือก ข้อมูลใน select tag แล้ว block เปลี่ยนตำแหน่งไปตามนั้น
โดย bankjittapol จ 04 พ.ย. 2019 11:51 am บอร์ด JavaScript & Jquery Ajax
1
53
จ 04 พ.ย. 2019 12:02 pm โดย tsukasaz
note
โดย numtan5839 จ 04 พ.ย. 2019 11:21 am บอร์ด M097 - ตรีเนตร บูรณโพธิ์ทอง
5
47
อ 12 พ.ย. 2019 7:49 pm โดย numtan5839
list ความรู้ที่มี ว่าเคยเรียน หรือ เคยทำอะไรมาบ้าง
โดย numtan5839 จ 04 พ.ย. 2019 11:15 am บอร์ด M097 - ตรีเนตร บูรณโพธิ์ทอง
3
42
จ 04 พ.ย. 2019 7:41 pm โดย numtan5839
Work's on Hand ตรีเนตร บูรณโพธิ์ทอง M097
โดย numtan5839 จ 04 พ.ย. 2019 11:09 am บอร์ด M097 - ตรีเนตร บูรณโพธิ์ทอง
1
16
จ 11 พ.ย. 2019 12:32 pm โดย numtan5839
เปลี่ยนภาษา webboard mindphp
โดย numtan5839 จ 04 พ.ย. 2019 10:58 am บอร์ด ถาม - ตอบ คอมพิวเตอร์
3
111
จ 04 พ.ย. 2019 11:23 am โดย numtan5839