首页 / JAVASCRIPT / JavaScript CheckBox实现全选和部分选择

JavaScript CheckBox实现全选和部分选择

内容导读

互联网集市收集整理的这篇技术教程文章主要介绍了JavaScript CheckBox实现全选和部分选择，小编现在分享给大家，供广大互联网技能从业者学习和参考。文章包含1888字，纯文字阅读大概需要3分钟。

内容图文

 1 <html>
 2 <head>
 3     <script>
 4         function BatchAddToBasket() {
 5             var questionNums = '';
 6             var checkboxs = document.getElementsByName('question');
 7             for (var i = 0; i < checkboxs.length; i++) {
 8                 var isChecked = false;
 9                 if (checkboxs[i].checked) {
10                     isChecked = true;
11                     break;
12                 }
13             }
14             if (!isChecked) {
15                 alert('请至少选择一个选项');
16                 return;
17             }
18 
19             for (var i = 0; i < checkboxs.length; i++) {
20                 if (checkboxs[i].checked) {
21                     questionNums += checkboxs[i].id;
22                     if (i < checkboxs.length - 1) 
23                     questionNums += ',';
24                 }
25             }
26             alert('选项id：' + questionNums);
27         }
28 
29         function SelectAll(obj) {
30             if (obj.checked) {
31                 var checkboxs = document.getElementsByName('question');
32                 for (var i = 0; i < checkboxs.length; i++) {
33                     checkboxs[i].checked = true;
34                 }
35             } else {
36                 var checkboxs = document.getElementsByName('question');
37                 for (var i = 0; i < checkboxs.length; i++) {
38                     checkboxs[i].checked = false;
39                 }
40             }
41         }
42     </script>
43 </head>
44 <body>
45     <div>
46         <input type="checkbox" name="checkboxAll" onclick="SelectAll(this)">
47         <button onclick="BatchAddToBasket()">加入试题篮</button>
48     </div>
49     <div>
50         <input type="checkbox" name="question" id=0>
51         <input type="checkbox" name="question" id=1>
52         <input type="checkbox" name="question" id=2>
53     </div>
54 </body>
55 </html>

 

内容总结

以上是互联网集市为您收集整理的JavaScript CheckBox实现全选和部分选择全部内容，希望文章能够帮你解决JavaScript CheckBox实现全选和部分选择所遇到的程序开发问题。 如果觉得互联网集市技术教程内容还不错，欢迎将互联网集市网站推荐给程序员好友。

内容备注

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 gblab@vip.qq.com 举报，一经查实，本站将立刻删除。

内容手机端

扫描二维码推送至手机访问。

本文链接：https://qyyshop.com/info/842492.html

来源：【匿名】