<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
</head>
<body>

<form id="form1" runat="server">
<div>
<input id="Checkbox1" name="all" type="checkbox" onclick="show()"/>全选/取消
<input id="Checkbox2" name="c1" type="checkbox" />1
<input id="Checkbox3" name="c1" type="checkbox" />2
<input id="Checkbox4" name="c1" type="checkbox" />3
<input id="Checkbox6" name="c1" type="checkbox" />4
<input id="Checkbox5" name="c1" type="checkbox" />5
</div>
</form>
</body>
<script>
function show()
{
//根据名字获取所有checkbox控件
var allCheckBoxs = document.getElementsByName("c1");

//半段点击了全选
if (document.getElementById("Checkbox1").checked == true) {

//循环让所有全选
for (var i = 0; i < allCheckBoxs.length ; i++) {
if (allCheckBoxs[i].type == "checkbox") {
allCheckBoxs[i].checked = true;
}
}
}
//点击了取消全选
else {
//循环取消全选
for (var i = 0; i < allCheckBoxs.length ; i++) {
if (allCheckBoxs[i].type == "checkbox") {
allCheckBoxs[i].checked = false;
}
}
}
}
</script>
</html>

js实现CheckBox全选或者不全选的更多相关文章

  1. 原生JS实现全选和不全选

    案例演示 源代码 <!DOCTYPE html> <html> <head lang="en"> <meta charset=" ...

  2. JS对checkbox全选和取消全选

    需求:checkbox控制列表数据全选与取消全选择. 效果图: 1.html <body > <input type="button" name="in ...

  3. jquery、js操作checkbox全选反选

    全选反选checkbox在实际应用中比较常见,本文有个不错的示例,大家可以参考下 操作checkbox,全选反选//全选 function checkAll() { $('input[name=&qu ...

  4. js解决checkbox全选和反选的问题

    function SelectAll() { var checkboxs=document.getElementsByName("chk_list"); for (var i=0; ...

  5. js实现checkbox全选与反选

    <script type="text/javascript" language="javascript"> function checkAll(id ...

  6. jQuery给CheckBox全选与不全选

    $(function(){ $("#checkAll").click(function() {//全选 $('input[name="DATA"]').prop ...

  7. js实现checkbox全选，全部选和反选效果

    效果: 源码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="U ...

  8. JS控制checkbox全选、取消全选、删除功能的代码贴出来。。

    function checkAll() { var code_Values = document.getElementsByTagName("input"); for(i = 0; ...

  9. jquery全选或不全选时，不操作已经禁用的checkbox

    $("#selectAll").click(function(){ if(this.checked ){ $(":checkbox[name='equid']" ...

随机推荐

  1. typescript接口扩展

    /* typeScript中的接口 接口扩展 */ /* 接口的作用:在面向对象的编程中,接口是一种规范的定义,它定义了行为和动作的规范,在程序设计里面,接口起到一种限制和规范的作用.接口定义了某一批 ...

  2. webpack 相关文章

    webpack loader原理 由于webpack是基于Node的所以webpack只能识别.js文件,所以针对其他的文件就需要转译,这时候就需要用到我们的loader了. https://blog ...

  3. Spring cloud微服务安全实战-4-3常见的微服务安全整体架构

    整体架构 这个图适合中小公司.麻雀虽小 五脏俱全.微服务架构所需要做的事在这个图里基本都有了. 绿色的不讲,主要讲的是这三块(橘黄色的).后面的和运维相关,会讲,不会讲的太深 订单服务 首先来写一个订 ...

  4. 全面系统Python3入门+进阶-1-4 Python的缺点

    结束

  5. hppts的理解

    参考: https://www.ruanyifeng.com/blog/2014/02/ssl_tls.html

  6. Python - Django - 母版和继承

    可以把多个页面相同的部分提取出来,放在一个母板里,这些页面只需要继承这个母板就好了 通常会在母板中定义页面专用的 CSS 块和 JS 块,方便子页面替换 定义块: {% block 名字 %} {% ...

  7. array_map

    <?php //对数组中的每个元素做函数处理 $arr = array(,,,,,); function cheng($hah){ ; } var_dump(array_map('cheng', ...

  8. 【端口转发】k8s port-forward端口转发 和 ssh -NfL端口转发

    kubectl port-forward端口转发 将远程pod端口转发到本地端口 kubectl port-forward monitoring-grafana-695c545f46-rhtwc -- ...

  9. Java基础教程：内部类

    Java基础教程:内部类 内部类 内部类,是指在一个类的内部定义的类.就像下面这样: public class EnclosingClass {   . . .   public class Nest ...

  10. TortoiseSVN安装和使用（转）

    http://blog.csdn.net/Zhihua_W/article/details/64904692?locationNum=2&fps=1 https://www.cnblogs.c ...