<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>无标题文档</title>

<script>

window.onload=function()

{

    var obtn1=document.getElementById("btn1");

    var obtn2=document.getElementById("btn2");

    var obtn3=document.getElementById("btn3");

    var odiv=document.getElementById("div1");

    var ach=odiv.getElementsByTagName("input");

    obtn1.onclick=function()

    {

        for(i=;i<ach.length;i++)

        {

            ach[i].checked=true;

        }

    }

    obtn2.onclick=function()

    {

        for(i=;i<ach.length;i++)

        {

            ach[i].checked=false;

        }

    }

    obtn3.onclick=function()

    {

        for(i=;i<ach.length;i++)

        {

            if(ach[i].checked==true)//注意if里面的==等号不能和赋值号=混淆

            {

                ach[i].checked=false;

            }

            else

            {

                ach[i].checked=true;

            }

        }

    }

}

</script>

</head>

<body>

<input  id="btn1" type="button" value="全选"  /></br>

<input  id="btn2" type="button" value="不选"  /></br>

<input  id="btn3" type="button" value="反选"  /></br>

<div id="div1">

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

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

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

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

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

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

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

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

</div>

</body>

</html>

js中的全选，不选，和反选按钮的设定的更多相关文章

  1. 原生js中实现全选和反选功能

    <!DOCTYPE html>      <html>      <head lang="en">          <meta char ...

  2. JS中innerHTML、outerHTML、innerText 、outerText、value的区别与联系？jQuery中的text()、html()和val()

    一.JS中innerHTML.outerHTML.innerText .outerText.value的区别与联系?jS中设置或者获取所选内容的值:①innerHTML :属性设置或返回该标签内的HT ...

  3. JS中表格的全选和删除要注意的问题

    在项目开发中,由于刚刚开始做项目,我对js还不是很精通,所以在用js对表格的全选和删除中遇到了不少问题,后来通过查找资料解决了,之后总结了一下关于js表格的全选和删除出现的一些问题,希望能帮助到大家. ...

  4. jquery中checkbox全选失效的解决方法

    这篇文章主要介绍了jquery中checkbox全选失效的解决方法,需要的朋友可以参考下     如果你使用jQuery 1.6 ,代码if ( $(elem).attr(“checked”) ),将 ...

  5. vue2.0实现在table中实现全选和反选

    其实在去年小颖已经写过一篇:Vue.js实现checkbox的全选和反选 小颖今天在跟着慕课网学习vue的过程中,顺便试试如何在table中实现全选和反选,页面的css样式是直接参考慕课网的样式写的, ...

  6. vue2.0在table中实现全选和反选

    其实在去年小颖已经写过一篇:Vue.js实现checkbox的全选和反选 小颖今天在跟着慕课网学习vue的过程中,顺便试试如何在table中实现全选和反选,页面的css样式是直接参考慕课网的样式写的, ...

  7. ExtJS中，将Grid表头中的全选复选框取消复选

    今天发现公司产品用的EXTJS中使用Grid时,Grid表头中的全选复选框的选中状态不是很准确,就写了这个小扩展 在js中加入下面方法,在需要取消全选的地方调用即可,例:Ext.getCmp('gri ...

  8. FineReport——JS二次开发（复选框全选）

    在进行查询结果选择的时候,我们经常会用到复选框控件,对于如何实现复选框全选,基本思路: 在复选框中的初始化事件中把控件加入到一个全局数组里,然后在全选复选框里对数组里的控件进行遍历赋值. 首先,定义两 ...

  9. js进阶 9-16 如何实现多选框全选和取消

    js进阶 9-16 如何实现多选框全选和取消 一.总结 一句话总结:选择取到每一个checkbox的值,然后赋值为true或者false就好. 1.如何实现多选框全选和取消? 选择取到每一个check ...

随机推荐

  1. GitLab/Git在AndroidStudio上的使用（转）

    1.在AndroidStudio上的配置GitLab 1)首先先将gitlab上的开发项目clone到本地(可以使用命令行或者管理工具,具体操作在GitLab中已经涉及,这里不再赘述),然后导入到An ...

  2. Go cron定时任务的用法

    cron是什么 cron的意思就是:计划任务,说白了就是定时任务.我和系统约个时间,你在几点几分几秒或者每隔几分钟跑一个任务(job),就那么简单. cron表达式 cron表达式是一个好东西,这个东 ...

  3. int 与Integer的用法与区别

    1.int是基本类型,直接存取数值,Integer是对象,用一个引用指向这个对象. 2.java中的数据类型分为基本数据类型和复杂数据类型,int是前者,Integer是后者(也就是一个类). 3.初 ...

  4. 减少图片HTTP 请求的方案

    <Higb Performance Web Sites>(中文名:“高性能网站建设指南”)这本书对于前端工程师来说,绝对值得一读.本人有幸从公司借阅了,但不幸的是感觉翻译有点怪怪的.尤其是 ...

  5. Tomcat简易安装指南

    由于要学习activiti的使用,而activiti依赖于tomcat,所以下载了一个tomcat 7 的binary包,然后按照running.TXT中的描述来手动安装,下文主要是记录了在阅读run ...

  6. css优化篇

    平时总说如何如何优化,今天就详细的写一下css如何优化,嘿嘿. 首先,CSS的优化工作主要从两个方面着手 网络性能:把CSS写到字节数最少,加快下载速度,自然可以让页面渲染的更快一些 语法性能:同样都 ...

  7. 浅析java类加载器ClassLoader

    作为一枚java猿,了解类加载器是有必要的,无论是针对面试还是自我学习. 本文从JDK提供的ClassLoader.委托模型以及如何编写自定义的ClassLoader三方面对ClassLoader做一 ...

  8. 一个简单js select插件

    现在,通过一个select插件,来介绍一下js插件的构建过程. 1.先上效果图 2.目录构建 (1)这个select插件,我给它起名交hongselect,所以呢,首先建个hongselect的文件夹 ...

  9. Git.Framework 框架随手记--ORM条件组合

    在上一篇<Git.Framework 框架随手记--ORM新增操作>中简单记录了如何对数据进行删除和修改,其用法都非常简单,在文章中提到了Where()方法,本文将详述Where() 等条 ...

  10. Android--TextView 文字显示和修改

    一. 新建一个Activity 和 Layout 首先在layout文件夹中新建一个activity_main.xml,在新建工程的时候一般默认会新建此xml文件,修改其代码如下: <Relat ...