效果：

代码：

 <head runat="server">

     <title></title>

     <script type="text/javascript">

         window.onload = function () {

             var ckall = document.getElementById('ck1');

             var ck = document.getElementsByName('name1');

             ckall.onclick = function () {

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

                     if (ckall.checked == true) {

                         ck[i].checked = true;

                     }

                     else {

                         ck[i].checked = false;

                     }

                 }

             }

         };

     </script>

 </head>

 <body>

     <form id="form1" runat="server">

     <input type="checkbox" id="ck1" />

     全选

     <div id="div1">

         <input type="checkbox" name="name1" />

         <input type="checkbox" name="name1" />

         <input type="checkbox" name="name1" />

         <input type="checkbox" name="name1" />

         <input type="checkbox" name="name1" />

         <input type="checkbox" name="name1" />

     </div>

     </form>

 </body>

点滴积累【JS】---JS小功能(checkbox实现全选和全取消)的更多相关文章

  1. JS小案例--全选和全不选列表功能的实现

    纯js代码实现列表全选和全不选的功能 <!DOCTYPE html> <html> <head lang="en"> <meta char ...

  2. 使用js实现全选功能。（全选，全不选，反选）

    作业210721 提交代码 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> ...

  3. js实现复选框的全选、全不选、反选

    js中实现复选框的全选,全不选以及反选,分为两种情况: (1)选中“请选择”前面的复选框实现全选,不选中“请选择”前面的复选框实现全不选 <!DOCTYPE html PUBLIC " ...

  4. js实现复选框的全选、全不选和反选

    js实现复选框的全选.全不选和反选 主要是用遍历的方法查找元素,然后通过改变checked的属性来选择,为true则是选中状态,为false则是未选状态 实现代码 <!DOCTYPE html& ...

  5. js 判断 复选框全选、全不选、反选、必选一个

    一个挺 使用的 js 代码片段,  判断  复选框全选.全不选.反选.必选一个 记录下, 搬来的 思路: 修改数据的 选中与否状态, 拿到所有的输入框,看是否有选中的状态 <html> & ...

  6. js复选框实现全选、全不选、反选

    复选框为checkbox对象 通过input就可以将一个简单的复选框呈现在页面上 <input type="checkbox" /> 要实现的大概就是这样一个页面 思路 ...

  7. 全选，全不选，反选的js实现

    全选练习       ** 使用复选框上面一个属性判断是否选中                   - checked属性                   - checked=true:选中    ...

  8. JS案例五：设置全选、全不选以及反选

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

  9. JS练习：表格全选与全不选

    代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title ...

  10. JavaScript学习——使用JS完成全选和全不选操作

    1.我们希望在后台系统实现一个批量删除的操作(全选所有的复选框)和全不选,显示效果如下: 2.步骤分析: 第一步:确定事件(onclick)并为其绑定一个函数(事件绑定到编号前面的复选框里面) 第二步 ...

随机推荐

  1. llvm之旅第一站 － 编译及简单使用 LLVM 图解

    http://www.nagain.com/activity/article/4/ http://blog.csdn.net/snsn1984/article/details/8593380

  2. 【java】java中替换中括号[ ]操作

    String aa ="[1,2,3]"; aa = aa.replaceAll("[\\[\\]]",""); 结果为 1,2,3

  3. 【项目 部署】部署项目web context root,项目跟路径跟项目实际名称不符

    项目如下: 但是部署到 tomcat下后,tomcat中项目根目录变成: 并且项目启动起来之后, 解决方法: 发现此处 不能更改,然后 在workspace下找到本项目,定位到.setting文件夹下 ...

  4. android源码包下载

    http://rgruet.free.fr/public/ 其他下载地址:http://cid-b50f9d5897331c44.office.live.com/browse.aspx/Android ...

  5. python笔记13-多线程实战篇（tomorrow）

    安装 1.tomorrow安装,用pip可以直接安装 pip install tomorrow 单线程 1.以下案例是单线程时候跑的情况,在下载图片的时候很耗时. # coding:utf-8 fro ...

  6. Android内存优化12 内存泄漏常见情况3 注册泄漏

    android 中有很多注册和反注册,由于在注册后,上下文自身会被持久化的观察者列表所持有,如果不进行反注册,就会造成内存泄漏 内存泄漏1:Sensor Manager 代码如下: MainActiv ...

  7. [转]Working with Transactions (EF6 Onwards)

    本文转自:http://www.cnblogs.com/xiepeixing/p/5275999.html Working with Transactions (EF6 Onwards) This d ...

  8. iOS:在OC中调用JS脚本

    示例一:在webView中调用js脚本进行搜索 1.首先导入JavaScriptCore.framework这个框架 2.创建webView.设置代理.请求手机端百度 #import "Vi ...

  9. oracle 10g函数大全--数值型函数

    ABS(x) [功能]返回x的绝对值 [参数]x,数字型表达式 [返回]数字 [示例] select abs(100),abs(-100) from dual; sign(x) [功能]返回x的正负值 ...

  10. 在Spring3中使用注解(@Scheduled)创建计划任务

    Spring3中加强了注解的使用,其中计划任务也得到了增强,现在创建一个计划任务只需要两步就完成了: 创建一个Java类,添加一个无参无返回值的方法,在方法上用@Scheduled注解修饰一下: 在S ...