<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>
</title>
</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>
</form>
<p>
<button id="all">全选</button>
<button id="notall">全不选</button>
<button id="unall">反选</button>
</p>
<script>
var all =document.getElementById('all');
var notall=document.getElementById('notall');
var unall=document.getElementById('unall');
var inputs =document.getElementsByTagName('input');
all.onclick=function(){
for(var i=0;i<inputs.length;i++){
inputs[i].checked=true;
}
}
notall.onclick=function(){
for(var i=0;i<inputs.length;i++){
inputs[i].checked=false;
}
}
unall.onclick=function(){
for(var i=0;i<inputs.length;i++){
inputs[i].checked = !inputs[i].checked;
}
}
</script>

</body>
</html>

js全选反选按钮实现的更多相关文章

  1. jquery、js全选反选checkbox

    操作checkbox,全选反选 //全选 function checkAll() { $('input[name="TheID"]').attr("checked&quo ...

  2. JS全选反选功能

    总选框:<input type="checkbox" class="all" name="all"> 子选框: <inpu ...

  3. js全选 反选

    // 全选 反选 allChoose: function (o) { var obj = $.extend(true, { id: "#id", name: "name& ...

  4. JS实现简单的多选选项的全选反选按钮

    1 <!DOCTYPE html> 2 <html> 3 <head lang="en"> 4 <!-- 5 需求: 6 1.写三个按钮: ...

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

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

  6. js 全选 反选

    1.全选 function selectAll(form){ for (var i = 0; i < form.elements.length; i++) { if (form.elements ...

  7. 关于js 全选 反选

    prop 对于HTML元素本身就带有的固有属性,在处理时,使用prop方法. attr  对于HTML元素我们自己自定义的DOM属性,在处理时,使用attr方法. $("#selectAll ...

  8. js全选反选

    <style type="text/css"> table { width: 800px; text-align: left; border-collapse: col ...

  9. js 全选反选

    <th><input type="checkbox" id="checkall" name="checkall" oncl ...

随机推荐

  1. [Recompose] Compose Streams of React Props with Recompose’s compose and RxJS

    Functions created with mapPropsStream canned be composed together to build up powerful streams. Brin ...

  2. ztree中依据后台中传过来的node的id，将这个node的复选框置为不可用

    var treeObj = $.fn.zTree.getZTreeObj("treeDemo");//树对象 var node = treeObj.getNodeByParam(& ...

  3. Java,泛型类型通配符和C#对照

    c#的泛型没有类型通配符,原因是.net的泛型是CLR支持的泛型,而Java的JVM并不支持泛型,仅仅是语法糖,在编译器编译的时候都转换成object类型 类型通配符在java中表示的是泛型类型的父类 ...

  4. Android入门篇（一）Androidproject的搭建，导入与导出，图标的改动

       先说一些题外话吧.这是小珂同学的处女作.可能写的不好,请各位读者见谅.我先讲讲我为什么要写博文,那应该也是机缘巧合,有一次.我问学长一个问题,学长发了一个连接给我,里面是一篇博客.那时我仅仅是看 ...

  5. 泛泰A820L (高通MSM8660 cpu) 3.4内核的CM10.1(Android 4.2.2) 測试版第二版

    欢迎关注泛泰非盈利专业第三方开发团队 VegaDevTeam  (本team 由 syhost suky zhaochengw(z大) xuefy(大星星) tenfar(R大师) loogeo cr ...

  6. php如何截取出视频中的指定帧作为图片

    php如何截取出视频中的指定帧作为图片 一.总结 一句话总结:截取视频指定帧为图片,php ffmpeg扩展已经完美实现,并且php ffmpeg是开源的 二.php如何截取出视频中的指定帧作为图片 ...

  7. @Transactional 事务注解

    @Transactional(propagation = Propagation.REQUIRED, isolation = Isolation.SERIALIZABLE, rollbackFor = ...

  8. Announcing Zuul: Edge Service in the Cloud--转

    原文地址:http://techblog.netflix.com/2013/06/announcing-zuul-edge-service-in-cloud.html   The Netflix st ...

  9. win7安装两个jdk,1.7和1.8，下载、安装、配置环境变量，方便切换

    之前用过1.6,后来换电脑后用的1.7,由于时代在发展,许多插件.框架等新的功能需要jdk1.8才能使用,所以就想安装1.8,不过1.7还不准备卸载,就考虑安装多个jdk. 先下载jdk1.8,建议去 ...

  10. 数据分析-jupyter

    安装 jupyter pip install jupyter 快捷键 插入 cell : a  b 删除cell  :  x 切换cell的模式: m  y 执行  shift +enter 查看帮助 ...