บทความนี้อธิบายถึงวิธีการของ JS ในการใช้การเลือกช่องทำเครื่องหมายที่ไม่เลือกและต่อต้านการเลือก แบ่งปันสำหรับการอ้างอิงของคุณ การวิเคราะห์เฉพาะมีดังนี้:
1. ความคิด:
1. รับองค์ประกอบ
2. เพิ่มเหตุการณ์คลิกเพื่อเลือกทั้งหมดโดยไม่ต้องเลือก
3. ช่องทำเครื่องหมายวนรอบพร้อมสำหรับ
4. ชุดเช็คที่ตรวจสอบเป็นจริงเพื่อเลือกทั้งหมด
5. ชุดเช็คที่ตรวจสอบเป็นเท็จเพื่อไม่ให้เลือก
6. การตัดสินโดยหากหากตรวจสอบเป็นจริงให้ตั้งค่าตรวจสอบเป็นสถานะเท็จและไม่ได้เลือกและหากตรวจสอบเป็นสถานะเท็จและไม่ได้เลือกให้ตั้งค่าตรวจสอบเป็นสถานะจริงและไม่ได้เลือก
2. รหัส HTML:
<อินพุต type = "button" value = "全选" id = "sele"/> <อินพุต type = "ปุ่ม" value = "不选" id = "setInterval"/> <อินพุต type = "ปุ่ม" value = "反选" id = "clear"/> <div id = "checkboxs" type = "ช่องทำเครื่องหมาย" /> <br /> <อินพุต type = "ช่องทำเครื่องหมาย" /> <br /> <อินพุต type = "ช่องทำเครื่องหมาย" /> <br /> <อินพุต type = "ช่องทำเครื่องหมาย" /> <br /> <อินพุต type = "ช่องทำเครื่องหมาย" /> <br /> < type = "ช่องทำเครื่องหมาย" /> <br /> <อินพุต type = "ช่องทำเครื่องหมาย" /> <br /> <อินพุต type = "ช่องทำเครื่องหมาย" /> <br /> <อินพุต type = "ช่องทำเครื่องหมาย" /> <br /> <อินพุต type = "ช่องทำเครื่องหมาย" /> <br /> < type = "ช่องทำเครื่องหมาย" /> <br /> <อินพุต type = "ช่องทำเครื่องหมาย" /> <br />
3. รหัส JS:
<script> window.onload = function () {var sele = document.getElementById ('sele'); // รับ var unsele = document.getElementById ('setInterval'); // รับ var ที่ไม่ได้เลือก = document.getElementById ('clear'); // checked = dexcbox.getElementsByTagname ('input'); // รับอินพุตภายใต้ div // เลือก sele.onclick = function () {สำหรับ (i = 0; i <checked.length; i ++) {ตรวจสอบ [i]. checked = true}} // ไม่เลือก unsele.onclick ตรวจสอบ [i] .Checked = false}} // unselect clear.onclick = function () {สำหรับ (i = 0; i <checked.length; i ++) {ถ้า (ตรวจสอบ [i] .checked = true) {checked [i]ฉันหวังว่าบทความนี้จะเป็นประโยชน์กับการเขียนโปรแกรม JavaScript ของทุกคน