javaScript的全选、反选和全不选

思路:首先获取复选框(checkbox)、接着遍历所有的复选框(checkbox)、最后判断他们的状态。

html结构

<input type=“checkbox” onclick="first()"/> 全选/全不选
<input type="checkbox" onclick="che()">JavaScript语言
<input type="checkbox" onclick="che()">C语言
<input type="checkbox" onclick="che()">C++语言
<input type="checkbox" onclick="che()">C#语言
<input type="checkbox" onclick="che()">php语言
<input type="checkbox" onclick="che()">Object—c语言

js行为

var che=document.getElementsByClassName('che');
var first=document.getElementById('first');
//全选 不全选
function first(){
for(var i=0;i<che.length;i++){
che[i].checked=first.checked //将第一个复选框的状态复值给其他的复选框
}
}
//不全选
function che(){
var a=true;
for(var i=0;i<che.length;i++){
if(che[i].checked != true){
a=false;
breack;
}
}
che[0].checked=a;
}

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 《ijs》速成开发手册3.0 官方用户交流:iApp开发交流(1) 239547050iApp开发交流(2) 10...
    叶染柒丶阅读 5,423评论 0 7
  • 单例模式 适用场景:可能会在场景中使用到对象,但只有一个实例,加载时并不主动创建,需要时才创建 最常见的单例模式,...
    Obeing阅读 2,142评论 1 10
  • [TOC] 课程内容回顾 什么是JavaScript,有几个部分组成脚本语言,浏览器,ECMAScript BO...
    chcvn阅读 536评论 0 0
  • 工厂模式类似于现实生活中的工厂可以产生大量相似的商品,去做同样的事情,实现同样的效果;这时候需要使用工厂模式。简单...
    舟渔行舟阅读 7,963评论 2 17
  • 半夜被店里的电话吵醒,打印机没墨了,因为是熟睡,电话铃把我惊出一身冷汗,下午打印机里的墨明明还有百分之十,一下子就...
    BARUSU阅读 183评论 0 0