กำหนดค่าให้สามารถเลือก checkbox ได้ตามที่เรากำหนด จัดทำโดย : เว็บไทยดีดี พิมพ์
 แสดง Loading ที่ Status Bar

บทความนี้การทำ Java Script ที่ทำการกำหนดค่าให้สามารถเลือก check ค่าใน checkbox ได้เท่าไหร่ครับ เป็น Script ที่ไม่ยากครับ

ขั้นตอนการทำ

1. สร้างไฟล์ demo.html เพื่อใช้ในการทดสอบ Script นะครับ แล้ว copy code ด้านล่างนี้ เอาไว้ที่ tag <head> นะครับ

<script type="text/javascript">
 function checkboxlimit(checkgroup, limit){
   var checkgroup=checkgroup
   var limit=limit
   for (var i=0; i<checkgroup.length; i++){
      checkgroup[i].onclick=function(){
      var checkedcount=0
      for (var i=0; i<checkgroup.length; i++)
        checkedcount+=(checkgroup[i].checked)? 1 : 0
      if (checkedcount>limit){
         alert("คุณสามารถเลือกได้ไม่เกิน "+limit+" หัวข้อครับ") // กำหนดข้อความที่ต้องการให้ Alert เตือน
         this.checked=false
         }
      }
   }
}
</script>

หลังจาก copy code มาวางไว้ที่ tag <head> แล้วนะครับ จะต้องเหมือนกับ code ด้านล่างนะครับ

<html>
<head>

<script type="text/javascript">
 function checkboxlimit(checkgroup, limit){
   var checkgroup=checkgroup
   var limit=limit
   for (var i=0; i<checkgroup.length; i++){
      checkgroup[i].onclick=function(){
      var checkedcount=0
      for (var i=0; i<checkgroup.length; i++)
        checkedcount+=(checkgroup[i].checked)? 1 : 0
      if (checkedcount>limit){
         alert("คุณสามารถเลือกได้ไม่เกิน "+limit+" หัวข้อครับ") // กำหนดข้อความที่ต้องการให้ Alert เตือน
         this.checked=false
         }
      }
   }
}
</script>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>สุ่มรหัสผ่าน</title>
</head>

<body>
</body>
</html>

2. หลังจากนั้นเรามาสร้าง Formตั้งชื่อ Form ว่า "article_test" ซึ่งประกอบไปด้วย checkbox ที่จะใช้จำนวน 5 checkbox
ตั้งชื่อ checkbox ว่า "article" ตามรูปด้านล่าง

3. และใส่ Java Script นี้ที่ท้าย Form ครับ

<script type="text/javascript">
    //กำหนดค่าที่จะให้สามารถเลือก Checkbox ได้เท่าไหร่ ในที่นี้ผมได้กำหนดไว้ให้เลือกได้ 2 Checkbox ครับ
    checkboxlimit(document.forms.article_test.article, 2)
</script>

4. เสร็จแล้วครับ พอเราคลิกเลือกที่ Checkbox เกินกว่าที่เรากำหนดก็จะแสดง Alert แจ้งขึ้นมาครับตามรูปด้านล่างครับ

คลิกดูตัวอย่าง

ข้อมูลจาก : http://javascriptkit.com/

คุณอาจสนใจ
การกำหนดรูปแบบในเซลล์
Mr.X (36,267 - 03 ก.ย. 50)
โปรแกรม SleepyTypeTool_v1.3.1.�แก้สระลอยใน Photoshop
Black-Hawk (56,371 - 27 ก.พ. 51)
การทำ Word Art
Mr.nook (22,321 - 28 ม.ค. 51)
กลุ่มเครื่องมือ WordArt
หมูขุน (13,762 - 04 ก.พ. 50)
โปรแกรมแรกของภาษา c
Mr.POP (29,107 - 26 พ.ย. 50)
การใช้งานคำสั่ง strftime
Mr.GuruZ (25,713 - 03 มิ.ย. 49)
ลบข้อความที่ค้างตอน Search Engine
เว็บไทยดีดี (15,264 - 29 ก.ย. 50)
Polygonal Lasso Tool (L)
Mr.GuruZ (71,279 - 22 ก.ย. 50)