<script language=javascript>
//第一种方法
function selectall1()
{
   var a = document.getElementsByTagName("input");
   if(a[0].checked==true){
   for (var i=0; i<a.length; i++)
      if (a[i].type == "checkbox") a[i].checked = false;
   }
   else
   {
   for (var i=0; i<a.length; i++)
      if (a[i].type == "checkbox") a[i].checked = true;
   }
}
//第二种方法
function selectall2() {
 var tform = document.forms['form1'];
 for (var i=0;i<tform.length;i++)
 {
  var e = tform.elements[i];
  if (e.type == "checkbox")
   e.checked = !e.checked;
 }
}

//第三种方法,结合上述两种方法
function selectall3()
{
   var a = document.getElementsByTagName("input");
   for (var i=0; i<a.length; i++)
      if (a[i].type == "checkbox") a[i].checked =!a[i].checked;
  }
//第四方法
function selectall4(id){ //用id区分  
var tform=document.forms['form1'];  
for(var i=0;i<tform.length;i++){  
var e=tform.elements[i];  
if(e.type=="checkbox" && e.name==id) e.checked=!e.checked;  
}  
}
//第五种方法
function selectall5(theform,thename){
var tform=document.forms[theform];
//document.getElementById("thewen").value='反选';
for(var i=0;i<tform.length;i++){
   var e=tform.elements[i];
   if(e.type=='checkbox' && e.name==thename)e.checked=!e.checked;
  }
}
</script>
<form id="form1" name="form1" method="post" action="">
  <input type="checkbox" name="sid" value="1" />
<input type="checkbox" name="sid" value="2" />
<input type="checkbox" name="sid" value="3" />
<input type="checkbox" name="sid" value="4" />
  <input name="thes" type="button" onclick="javascript:selectall1()" value="第一种" />
  <input name="thes" type="button" onclick="javascript:selectall2()" value="第二种" />
  <input name="thes" type="button" onclick="javascript:selectall3()" value="第三种" />
  <input name="thes" type="button" onclick="javascript:selectall4('sid')" value="第四种" />
  <input name="thes" type="button" onclick="javascript:selectall5('form1','sid')" value="第五种" />
</form>

JavaScript---复选框全选的多种实现的更多相关文章

  1. JavaScript小例子:复选框全选

    JavaScript小例子:复选框全选 这只是一个小例子,很简单,但是这个功能还是很常用的: 实现后效果如图: JavaScript代码: <script type="text/jav ...

  2. js 复选框 全选都选 如果某一个子复选框没选中 则全选按钮不选中

    <!DOCTYPE HTML> <html> <head> <meta charset=UTF-8> <title>js 复选框 全选都选 ...

  3. 复选框全选、全不选和反选的效果实现VIEW:1592

    <html> <head> <meta http-equiv="Content-Type" content="text/html; char ...

  4. html+css+js实现复选框全选与反选

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

  5. checkbox复选框全选批量删除

    多选框全选实现批量删除 html代码 <body> <form action="" method="post" name="Form ...

  6. jQuery 复选框全选/取消全选/反选

    jQuery实现的复选框全选/取消全选/反选及获得选择的值. 完整代码: <!DOCTYPE html> <html> <head> <script type ...

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

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

  8. jQuery实现复选框 全选、反选、全不选

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <hea ...

  9. jQuery中的几个案例:隔行变色、复选框全选和全不选

    1 表格隔行变色 1 技术分析: 1 )基本过滤选择器: odd: even: 2 )jq添加和移除样式: addClass(); removeClass(); 2 代码实现 <script s ...

  10. js实现复选框全选/全不选/反选

    js实现复选框全选/全不选/反选 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "h ...

随机推荐

  1. PHP面向对象(OOP)编程入门教程链接

    PHP官方学习OOP: http://php.net/manual/zh/oop5.intro.php 从其他博主学习:(以下链接来源: http://blog.snsgou.com/post-41. ...

  2. copy "xxxxx\xx.dll xxxxxxx\ ” 已退出,代码为1 错误解决方法

    右键=>属性=>生成事件里面,查看预先生成事件命令行和后期生成事件命令行,查看复制的Dll是否存在已经路径是否正确

  3. C#图解教程读书笔记(第5章 方法)

    类型推断和var关键字 从C#3.0开始,可以在变量声明的开始部分的的位置使用新的关键字var. Var关键字并不是某种特别类型的符号.它只是句法上的速记,表示任何可以从初始化的右边推断出的类型. V ...

  4. 鉴定JavaScript中的数据类型

    众所周知,JavaScript是一门弱类型的语言,但是这并不代表JavaScript中没有数据类型.JavaScript中常见的数据类型有string.number.object等等,通常我们使用ty ...

  5. IDEA 搭建Java WEB 开发环境

    本文是一篇讲解如何在 目前比较流行的IntellJ IDEA 下搭建JavaWEB的说明文档, 如有写的不详细的地方,希望各位留下自己宝贵的意义. Tips : 遇到的问题 , 请耐心看完文章,在文章 ...

  6. Ubuntu下Apache配置网站根路径

    安装之后apache默认的跟路径是/var/www/   如何修改这个默认路径呢?   直接编辑/etc/apache2/sites-available/default-ssl.conf,将Docum ...

  7. mybatis动态sql语句学习(一)

    动态 SQL MyBatis 的强大特性之一便是它的动态 SQL.如果你有使用 JDBC 或其他类似框架的经验,你就能体会到根据不同条件拼接 SQL 语句有多么痛苦.拼接的时候要确保不能忘了必要的空格 ...

  8. Spring(十八)之页面重定向

    首先说明,该示例的maven依赖可以复用Spring(十七)之表单处理还有 还有就是对应的web.xml和servlet.xml文件都能复用,不必再次修改. 说到重定向不得不提到一个转发.这里概述一下 ...

  9. mysql5.7.22tar包安装

    mysql5.7.22tar包安装 #卸载系统自带的Mariadb [root@ ~]# rpm -qa|grep mariadb mariadb-libs-5.5.44-2.el7.centos.x ...

  10. java基本方法

    Java 方法 在前面几个章节中我们经常使用到 System.out.println(),那么它是什么呢? println() 是一个方法. System 是系统类. out 是标准输出对象. 这句话 ...