<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

<title>javascript checkbox全选 反选  全不选</title>

<meta name="description" content="">

<meta name="keywords" content="">

<link href="" rel="stylesheet">

</head>

<body>

    <form action="">

        <p><input type="checkbox"></p>

        <p><input type="checkbox"></p>

        <p><input type="checkbox"></p>

        <p><input type="checkbox"></p>

        <p><input type="checkbox"></p>

        <p><input type="checkbox"></p>

        </br>

        <input type="button" id="a_xuan" value="全选" onclick="all_xuan()">

        <input type="button" id="a_n_xuan" value="反选" onclick="fan_xuan()">

        <input type="button" id="f_xuan" value="全不选" onclick="all_no_xuan()">

    </form>

</body>

<script>

//全选

function all_xuan()

{

    var all_xuan=document.getElementById('a_xuan');

    if(all_xuan!='')

    {

        var input_c=document.getElementsByTagName('input');

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

        {

            input_c[i].checked="true";

        }

    }

}

//全不选

function all_no_xuan()

{

    var all_xuan=document.getElementById('f_xuan');

    if(all_xuan!='')

    {

        var input_c=document.getElementsByTagName('input');

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

        {

            input_c[i].checked="";

        }

    }

}

//反选

function fan_xuan()

{

    var all_xuan=document.getElementById('a_n_xuan');

    if(all_xuan!='')

    {

        var input_c=document.getElementsByTagName('input');

        for(var i=0;i<input_c.length-1;i++)

        {

            if(input_c[i].checked)

            {

                input_c[i].checked="";

            }else

            {

                input_c[i].checked="true";

            }

        }

    }

}

</script>

</html>

表单javascript checkbox全选 反选 全不选的更多相关文章

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

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

  2. 表单提交checkbox的值

    问题:怎么在表单提交的时候提交多个多选框CheckBox的值? 解决方式:在CheckBox的name属性名后添加[]; 例: <input type="checkbox" ...

  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. Bootstrap 表单和图片 （内联表单，表单合组，水平排列，复选框和单选框，下拉列表，校验状态，添加额外的图标，控制尺寸，图片）

    一．表单 基本格式 注:只有正确设置了输入框的 type 类型,才能被赋予正确的样式. 支持的输入框控件 包括:text.password.datetime.datetime-local.date.m ...

  7. 文字和表单（checkbox/radio）元素垂直对齐方法，兼容Firefox和IE。

    这几天在做表单时总会碰到复选框(checkbox)和单选框(radio)与文字不对齐的问题,要不是checkbox上浮了,要不是文字上浮.在前端开发过程中,单(复)选框和它们后面的提示文字在不进行任何 ...

  8. 在PHP中处理表单之—Checkbox

    原文翻译自:http://www.html-form-guide.com/php-form/php-form-checkbox.html 单个checkbox  形如: <form action ...

  9. Vue表单输入绑定（文本框和复选框）

    文本框 <!DOCTYPE html><html>    <head>        <meta charset="utf-8">  ...

随机推荐

  1. Java基础 -- 冒泡排序算法(带详细注释)

    冒泡排序的要点: 1.多轮排序,每轮排序中选出最大的元素放在最顶端,并且下次排序不再使用该元素; 2. 使用双for循环,外层for循环控制要排序的次数(轮数), 内层for循环控制当前要排序的元素并 ...

  2. JavaScript学习总结（二）

    JavaScript学习总结(二) ---- 对象 在JavaScript中,几乎用到的每个js都离不开它的对象.下面我们深入了解一下js对象. js中对象的分类跟之前我们学过的语言中函数的分类一样, ...

  3. tomcat下配置https环境

    在网上搜了一下,内容不是非常完好. 现进行整理,做个学习笔记,以备以后使用. (1)进入到jdk下的bin文件夹 (2)输入例如以下指令"keytool -v -genkey -alias ...

  4. C#基础：命令解析

    1.普通格式命令的解析 例如: RENA<SP>E:\\A.txt<SP>C:\\B.txt<CRLF> (SP -> 空格,CRLF -> 回车加换行 ...

  5. Asp.Net HttpApplication请求管道与Session（二）

    Asp.Net 回话的创建与结束 LogHelper.LogHelper _log = new LogHelper.LogHelper(); /// <summary> /// 程序开始- ...

  6. 《第一行代码》学习笔记12－UI（1）

    1.程序需要注销或者退出,用一个专门的集合类对所有的活动进行管理即可. 2.可视化编辑工具不利于真正了解界面背后的实现原理,通常这种方式制作的界面都不具有很好的屏幕适配性, 而且当需要编写较为复杂的界 ...

  7. 《第一行代码》学习笔记7－活动Activity（5）

    1.Intent中只能指定一个action,但却能指定多个category. 2.使用隐式Intent,不仅可以启动自己程序内的活动,还可以启动其他程序的活动,使得Android应用程序之间 的功能共 ...

  8. redis批量执行

    1.首先把redis命令放在txt文件中 eg: 文件名:  test.txt 内容如下: HMSET HM_001 name zhang01 age HMSET HM_002 name zhang0 ...

  9. Python爬虫——抓取贴吧帖子

    抓取百度贴吧帖子 按照这个学习教程,一步一步写出来,中间遇到很多的问题,一一列举 首先, 获得 标题 和 贴子总数 # -*- coding:utf-8 -*- #!/user/bin/python ...

  10. c#中将默认常量(32bit)转换为8bit

    // //将int进制转换 // private byte hex(int myHex) { byte[] a = BitConverter.GetBytes(myHex); return a[0]; ...