目标效果：网页全选功能，即点击全选标签可选择全部复选框

实现代码如下

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <script type="text/javascript">

        window.onload=function () //加载全部网页内容

        {

            var obtn = document.getElementById('btn'); //获取全选标签

            var ainput = document.getElementsByTagName('input');//获取全部input标签即获取全部复选框

            var i = 0;

            obtn.onclick=function ()//点击全部标签要执行下面事件

            {

                for (i=0;i<ainput.length;i++)

                {

                    ainput[i].checked=true;//重复选择复选框

                }

            }

        }

    </script>

</head>

<body>

    <p id="btn">全选</p>

    <input type="checkbox" />

    <input type="checkbox" />

</body>

</html>

js之全选即点击全选标签可选择全部复选框的更多相关文章

  1. Jquery复选框的全选全不选及选择所有复选框实现全选的复选框

    Jquery代码 $(function () { $(":checkbox.parentfunc").click(function () { //如何获取被点击的那个复选框 $(t ...

  2. JAVA个人小程序GUI篇-收银（标签、按钮、复选框、下拉标、文本域、表格······）

    如果用eclipse需先装载windowsbuild //导入包 import java.awt.BorderLayout; import java.awt.EventQueue; import ja ...

  3. jquery获取当前被选择的复选框的value的集合

    1.HTML代码 <input type="checkbox" name="productID" value="0"> < ...

  4. GridControl 选择列、复选框全选（上）

    说明: GirdControl 中添加一列,这一列不是写在数据库中的,而是代码中添加的. 图示: 底层类代码: #region GridControl 全选 /// <summary> / ...

  5. 关于复选框input[type=checkbox]

    关于复选框input[type=checkbox],其实在前面的文章中说过一次,当时主要关注点在设置复选框的状态,利用prop实现,今天继续关注一下复选框. 自己在项目中,遇到一个全选/全不选的需求, ...

  6. jquery完成带复选框的表格行高亮显示

    jquery完成带复选框的表格行高亮显示 通过jquery技术来操作表格是件简单的事,通过jquery的语法,可以很轻松的完成表格的隔行换色,悬浮高亮,在实际的应用中可能会出现表格中带复选框的,删除时 ...

  7. jQuery+SpringMVC中的复选框选择与传值

    一.checkbox选择 在jQuery中,选中checkbox通用的两种方式: $("#cb1").attr("checked","checked& ...

  8. Angular/Vue多复选框勾选问题

    此页面效果以Angular实现,Vue也可按照其大致流程实现,其核心本质没有改变. 功能效果为:页面初始化效果为要有所有角色的复选框,要求初始化默认勾选的角色要显示勾选,之后,能按照最终勾选的状态提交 ...

  9. 转 纯CSS设置Checkbox复选框控件的样式

    Checkbox复选框是一个可能每一个网站都在使用的HTML元素,但大多数人并不给它们设置样式,所以在绝大多数网站它们看起来是一样的.为什么不把你的网站中的Checkbox设置一个与众不同的样式,甚至 ...

随机推荐

  1. 7.AOP编程

    注解和xml混合使用 1.将所有的bean都配置xml中 <bean id="" class=""> 2.将所有的依赖都使用注解 @Autowire ...

  2. requests应用

    一.简介 什么是requests模块: requests模块是python中原生的基于网络请求的模块,其主要作用是用来模拟浏览器发起请求.功能强大,用法简洁高效.在爬虫领域中占据着半壁江山的地位. 为 ...

  3. setAttribute的浏览器兼容性（转）

    1.element要用getElementById or ByTagName来得到, 2.setAttribute("class", vName)中class是指改变"c ...

  4. javaScript 节流与防抖

    首先 我们要知道 节流与防抖可以干什么. 优化网络请求性能——节流 优化页面请求性能——防抖 举两个简单的小例子: 节流: 例如 有些购物页面,会有一些让你抢购的活动,到点的时候,需要你快速的点某个按 ...

  5. Maven classifier 元素妙用

    首先来看这么一个依赖 <dependency> <groupId>net.sf.json-lib</groupId> <artifactId>json- ...

  6. [EXP]CVE-2018-2628 Weblogic GetShell Exploit

    漏洞简介 漏洞威胁:RCE--远程代码执行 漏洞组件:weblogic 影响版本:10.3.6.0.12.1.3.0.12.2.1.2.12.2.1.3 代码: # -*- coding: utf-8 ...

  7. 使用POI导出Excel文件

    创建表头信息 表头信息用于自动生成表头结构及排序 public class ExcelHeader implements Comparable<ExcelHeader>{ /** * ex ...

  8. odoo开发笔记 -- 翻译机制及导入.po文件

    待补充 http://ju.outofmemory.cn/entry/181972

  9. .NetCore使用skywalking实现实时性能监控

    一.简介 很久之前写了一篇 <.Net Core 2.0+ InfluxDB+Grafana+App Metrics 实现跨平台的实时性能监控>关于NetCore性能监控的文章,使用Inf ...

  10. glide使用

    glide在github地址:https://github.com/bumptech/glide 1.添加依赖(最好看官网,因为有时候添加依赖的会有轻微改动,版本也会一直更新) repositorie ...