<html>

 <head>

     <script>

         function BatchAddToBasket() {

             var questionNums = '';

             var checkboxs = document.getElementsByName('question');

             for (var i = 0; i < checkboxs.length; i++) {

                 var isChecked = false;

                 if (checkboxs[i].checked) {

                     isChecked = true;

                     break;

                 }

             }

             if (!isChecked) {

                 alert('请至少选择一个选项');

                 return;

             }

             for (var i = 0; i < checkboxs.length; i++) {

                 if (checkboxs[i].checked) {

                     questionNums += checkboxs[i].id;

                     if (i < checkboxs.length - 1)

                     questionNums += ',';

                 }

             }

             alert('选项id：' + questionNums);

         }

         function SelectAll(obj) {

             if (obj.checked) {

                 var checkboxs = document.getElementsByName('question');

                 for (var i = 0; i < checkboxs.length; i++) {

                     checkboxs[i].checked = true;

                 }

             } else {

                 var checkboxs = document.getElementsByName('question');

                 for (var i = 0; i < checkboxs.length; i++) {

                     checkboxs[i].checked = false;

                 }

             }

         }

     </script>

 </head>

 <body>

     <div>

         <input type="checkbox" name="checkboxAll" onclick="SelectAll(this)">

         <button onclick="BatchAddToBasket()">加入试题篮</button>

     </div>

     <div>

         <input type="checkbox" name="question" id=0>

         <input type="checkbox" name="question" id=1>

         <input type="checkbox" name="question" id=2>

     </div>

 </body>

 </html>

JavaScript CheckBox实现全选和部分选择的更多相关文章

  1. html javascript checkbox实现全选功能

    html代码 <input type="checkbox" id="all" />all</input> <input type= ...

  2. JS 控制checkbox 获取 全选 全不选 一行不选择全选则不被选择 所有选择全选被选择

    //点击全选button的事件操作 function selectAll(){ var allcheckBoxs=document.getElementsByName("iTo") ...

  3. js之全选即点击全选标签可选择全部复选框

    目标效果:网页全选功能,即点击全选标签可选择全部复选框 实现代码如下 <!DOCTYPE html> <html lang="en"> <head&g ...

  4. jquery checkbox 选中 全选 插件

    checkbox  选中 全选 在项目中经常用到,但是不同的程序员写出的东西各有差异,在此整合了jquery checkbox插件,用起来很方便,也总结了我们项目中通常会出现问题的地方,一行代码搞定. ...

  5. react实现全选、取消全选和个别选择

    react里面实现全选和取消全选,个别选择等操作,效果如下 代码: import React, {Component} from 'react' export default class Demo e ...

  6. html checkbox 实现全选/取消全选

    html checkbox  实现全选/取消全选 <html> <body> <table border="1"> <tr> < ...

  7. jquery中checkbox的全选与反选

    <!DOCTYPE html><html><head> <meta charset="utf-8" /> <title> ...

  8. 让DuiLib CheckBox支持全选、全不选、非全选三种状态

    原文 https://blog.csdn.net/EveyX/article/details/38433783 DuiLib官方库中的Checkbox只有Checked和Uncheck两种状态,但我们 ...

  9. jQuery checkbox的全选与反选

    1:checkbox的全选与反选 js 代码 $("#cbAll").click(function(){ if($("#cbAll").is(":ch ...

随机推荐

  1. python函数之sorted与sort

    Python list内置sort()方法用来排序,也可以用python内置的全局sorted()方法来对可迭代的序列排序生成新的序列. sorted(iterable,key=None,revers ...

  2. datepicker

    准备工作 首先请到jqueryui.com官网下载datepicker插件代码,注意官网提供了整个jquery ui的所有插件下载,但是您可以选择其中几个用到的插件下载,本文中只用到datepicke ...

  3. [转载]Linux内核list_head学习（二）

    前一篇文章讨论了list_head 结构的基本结构和实现原理,本文主要介绍一下实例代码. 自己如果想在应用程序中使用list_head 的相应操作(当然应该没人使用了,C++ STL提供了list 用 ...

  4. Spring中的线程池ThreadPoolTaskExecutor介绍

    前言: Java SE 5.0引入了ThreadPoolExecutor.ScheduledThreadPoolExecutor.Spring 2.x借助ConcurrentTaskExecutor和 ...

  5. #pragma pack 在BITMAP结构体定义中的使用

    BITMAP位图文件主要分为如下3个部分: 块名称 对应Windows结构体定义 大小(Byte) 文件信息头 BITMAPFILEHEADER 14 位图信息头 BITMAPINFOHEADER 4 ...

  6. iOS中的数据存储

    SQLite3 SQLite3是一款开源的嵌入式关系型数据库,可移植性好,易使用,内存开销小. SQLite3是无类型的,意味着你可以保存任何类型的数据到任意表的任意字段中. SQLite3常用的4种 ...

  7. jQuery UI vs Kendo UI & jQuery Mobile vs Kendo UI Mobile

    jQuery UI vs Kendo UI http://jqueryuivskendoui.com/#introduction jQuery Mobile vs Kendo UI Mobile ht ...

  8. 将chrome浏览器的默认背景颜色修改为浅绿色，以减缓长时间看电脑的眼睛不舒服的问题

    修改chrome文件夹中的Custom.css, 此文件里面默认内容是空的. 在其中添加下面这段代码: 你也可以选择自己的喜欢的颜色, 前提是你知道你想要更改的颜色的十六进制颜色值, 例如:#CCEB ...

  9. 图解缓存淘汰算法三之FIFO

    1.概念分析 FIFO(First In First Out),即先进先出.最先进入的数据,最先出来.一个很简单的算法.只要使用队列数据结构即可实现.那么FIFO淘汰算法基于的思想是"最近刚 ...

  10. 2016.5.30让窗口处于最顶层的方法，比TopMost灵活

    最简单的方法Form. Activate() 稍复杂的方法用API,目前没有看出比第一种方法有什么好处(可操作其它窗口,这就是好处2016.7.31) [System.Runtime.InteropS ...