使用js实现全选、反选、全不选。

代码如下：

<html>

<head>

<script type="text/javascript">

function checkEvent(name,allCheckId)

{

  var allCk=document.getElementById(allCheckId);

  if(allCk.checked==true)

  checkAll(name);

  else

  checkAllNo(name);

}  

//全选

function checkAll(name)

{

  var names=document.getElementsByName(name);

  var len=names.length;

  if(len>0)

  {

   var i=0;

   for(i=0;i<len;i++)

   names[i].checked=true;

  }

}  

//全不选

function checkAllNo(name)

{

  var names=document.getElementsByName(name);

  var len=names.length;

 if(len>0)

  {

    var i=0;

    for(i=0;i<len;i++)

    names[i].checked=false;

  }

}  

//反选

function reserveCheck(name)

{

  var names=document.getElementsByName(name);

  var len=names.length;  

 if(len>0)

 {

 var i=0;

   for(i=0;i<len;i++)

   {

     if(names[i].checked)

     names[i].checked=false;

     else

     names[i].checked=true;

   }

 }

}

</script>

</head>

<body>

<input type="checkbox" id="ckall" onclick="checkEvent('ckcontact','ckall')" />全选

<input type="checkbox" id="ckReserve" onclick="reserveCheck('ckcontact','ckReserve')" />反选

<br />

<input type="checkbox" name="ckcontact" value="1" />篮球

<br />

<input type="checkbox" name="ckcontact" value="2" />旅游

<br />

<input type="checkbox" name="ckcontact" value="3" />读书

<br />

<input type="checkbox" name="ckcontact" value="4" />美食

<br />

<input type="checkbox" name="ckcontact" value="5" />睡觉

</body>

</html>

Javascript全选，反选，全不选的实现代码的更多相关文章

  1. 表单javascript checkbox全选 反选 全不选

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

  2. 【HTML5】页面点击按钮添加一行 删除一行 全选 反选 全不选

    页面点击按钮添加一行    删除一行   全选   反选  全不选 页面效果图如下 html页面代码 <!DOCTYPE html> <html> <head> & ...

  3. 表单Checkbox全选反选全不选

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  4. checkbook全选/反选/全不选

    <!doctype html><html lang="en"><head> <meta charset="UTF-8" ...

  5. vue实现单选多选反选全选全不选

    单选 当我们用v-for渲染一组数据的时候,我们可以带上index以便区分他们我们这里利用这个index来简单地实现单选 <li v-for="(item,index) in radi ...

  6. html js 全选 反选 全不选源代码

    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...

  7. js实现全选,反选,全不选

    思路:1.获取元素.2.用for循环历遍数组,把checkbox的checked设置为true即实现全选,把checkbox的checked设置为false即实现不选.3.通过if判断,如果check ...

  8. WPF DataGrid CheckBox 多选 反选 全选

    效果图 实现此效果的必要关键是 Style+DataTemplate 关键代码: <Window.Resources> <DataTemplate x:Key="Check ...

  9. JavaScript Web API 全选反选案例

    全选反选 全选和反选功能,在开发中可以说是应用得非常多的,以下通过案例分解,学习如何使用JS实现全选反选功能. 该功能可分为如下三大步骤: 1.全选 1.1 获取父checkbox,注册点击事件 1. ...

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

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

随机推荐

  1. class字节码结构（四）（方法集合的结构）

    <Java虚拟机原理图解>1.5. class文件中的方法表集合--method方法在class文件中是怎样组织的 一个类有多个方法,所以方法肯定是一个集合. 目标是: 1,了解方法在字节 ...

  2. 【qboi冲刺NOIP2017复赛试题4】 全套题目+题解+程序

    作为一个好人(验题人),我给大家奉上下这套题的题解,并且预祝大家这套题能够AK: T1题面:Alice现在有n根木棍,他们长度为1,2,3....n,Bob想把某一些木棍去掉,使得Alice剩下的木棍 ...

  3. 【Java并发编程】：守护线程与线程阻塞的四种情况

    守护线程 JAVA中有两类线程:User Thread(用户线程).Daemon Thread(守护线程) 用户线程即运行在前台的线程,而守护线程是运行在后台的线程. 守护线程作用是为其他前台线程的运 ...

  4. [转]你真的了解 console 吗

    原文:https://segmentfault.com/a/1190000000481884 对于前端开发者来说,在开发过程中需要监控某些表达式或变量的值的时候,用 debugger 会显得过于笨重, ...

  5. [转]MVC HtmlHelper用法大全

    原文链接:http://www.cnblogs.com/jyan/archive/2012/07/23/2604474.html HtmlHelper用来在视图中呈现 HTML 控件. 以下列表显示了 ...

  6. elasticsearch（二） 之 elasticsearch安装

    目录 elasticsearch 安装与配置 安装java 安装elastcsearch 二进制安装(tar包) 在进入生产之前我们必须要考虑到以下设置 增大打开文件句柄数量 禁用虚拟内存 合适配置的 ...

  7. PHP PSR 标准

    引用他人文章:http://www.cnblogs.com/52php/p/5852572.html PHP中PSR-[0-4]代码规范 PHP-FIG 在说啥是PSR-[0-4]规范的之前,我觉得我 ...

  8. C#的TextBox获取行高

    当TextBox使用多行之后,如果想获取每行的高度,似乎有点问题, TextBox.Height获取的是控件的高度, 而我们常做的是根据行的数量来决定是否要显示滚动条 如下: //不能直接获取每行的高 ...

  9. Spark程序本地运行

    Spark程序本地运行   本次安装是在JDK安装完成的基础上进行的!  SPARK版本和hadoop版本必须对应!!! spark是基于hadoop运算的,两者有依赖关系,见下图: 前言: 1.环境 ...

  10. ZOJ 1203 Swordfish（Prim算法求解MST）

    题目: There exists a world within our world A world beneath what we call cyberspace. A world protected ...