//html内容

<body>
<div id="d1">
<input type="checkbox" class="in2">全选
<input type="checkbox">
<input type="checkbox">
<input type="checkbox">
<input type="checkbox">
<input type="checkbox">
</div>
<div id="d2">
<input type="checkbox" class="in2">全选
<input type="checkbox">
<input type="checkbox">
<input type="checkbox">
<input type="checkbox">
<input type="checkbox">
</div>
<div id="d3">
<input type="checkbox" class="in2">全选
<input type="checkbox">
<input type="checkbox">
<input type="checkbox">
<input type="checkbox">
<input type="checkbox">
</div>
<div id="d4">
<input type="checkbox" class="in2">全选
<input type="checkbox">
<input type="checkbox">
<input type="checkbox">
<input type="checkbox">
<input type="checkbox">
</div>
</body>

//
<script src="jquery-3.1.1.min.js"></script>//引入jquery
<script>
$('.in2').click(function () {                        //点击class为in2的input是触发
var div2=this.closest('div').children;          //使用closest方法获取父节点，然后使用children获取所有子元素
if(div2[0].checked){　　　　　　　　　　　//判断第一个input的checked状态，如果为true，则其它都为true
for (var i = 0; i <div2.length; i++) {
div2[i].checked=true;
}
}
else{
for (var i = 0; i <div2.length; i++) {
div2[i].checked=false;
}

}

})

</script>

页内多个input全选不干扰且只用一段代码。的更多相关文章

  1. 关于input全选反选恶心的异常情况

    上一篇讲到:第一次点击全选按钮input显示对勾,第二次则不显示,需要用prop来添加checked属性. 但是用prop会出现一个问题,对勾显示,而checked属性不会被添加(比如:$(" ...

  2. input全选和取消全选

    <!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title> ...

  3. input全选与单选(把相应的value放入隐藏域去)

    框架是Jquery 需求是: 页面上有很多复选框,1.当我选择一项复选框时候 把对应的值放入到隐藏域去 2.当我反选的时候 把隐藏域对应的值删掉.3.当我全选的时候 页面上所有的选择框的值一起放到隐藏 ...

  4. input 全选 jquery封装方法

    HTML代码 <table class="table table-striped"> <thead> <tr> <th><in ...

  5. 页面的checkbox框的全选与反选

    if (typeof jQuery == 'undefined') {     alert("请先导入jQuery");} else {    jQuery.extend({    ...

  6. jqurey 遍历 div内的所有input单选复选按钮并判断是否选中及Attr（checked）无效的解决

    关于页面前面标签 <ul> @{ foreach (var item in vote) { if (!string.IsNullOrEmpty(item.Img)) { <li cl ...

  7. input checkbod 全选 反选

      <script>             var CheckBox=div.getElementsByTagName('input');                         ...

  8. JavaScript实现表单的全选,反选,获取值

    构思 通过for循环和for in循环来实现,界面效果如下 步骤 全选: 循环给所有的表单设置checked 反选: 循环内判断checked是否为true,如果为true则改为false否则改为tr ...

  9. 移动端html5页面长按实现高亮全选文本内容的兼容解决方式

    近期须要给html5的WebAPP在页面上实现一个复制功能:用户点击长按文本会全选文字并弹出系统"复制"菜单.用户能够点击"复制"进行复制操作.然后粘贴到App ...

随机推荐

  1. Eclipse Maven Spring MyBatis 配置

    <?xml version="1.0" encoding="UTF-8"?> <project xmlns="http://mave ...

  2. HTML5新特性之Mutation Observer

    Mutation Observer(变动观察器)是监视DOM变动的接口.当DOM对象树发生任何变动时,Mutation Observer会得到通知. 要概念上,它很接近事件.可以理解为,当DOM发生变 ...

  3. MVP解析

    一套可以直接复制使用的MVP框架 通过对MVP设计模式学习,对MVP也有了一个初步的认识,以登录Login模块为例,封装MVP如下: package com.example.administrator ...

  4. IOS 杂笔－9 （MD5 加密）

    首先是一段对MD5的简介 *出自一位大牛之手* Message Digest Algorithm MD5(中文名为消息摘要算法第五版)为计算机安全领域广泛使用的一种散列函数,用以提供消息的完整性保护 ...

  5. Play Framework 项目遇到问题

    1.Debug调试出错,提示: Error occurred during initialization of VMagent library failed to init: jdwpERROR: C ...

  6. SQL Server中删除重复数据

    delete from A ) )

  7. JavaScript基本知识

    如何把 JavaScript 放入 HTML 页面 如果需要把一段 JavaScript 插入 HTML 页面,我们需要使用 <script> 标签(同时使用 type 属性来定义脚本语言 ...

  8. Spark运行模式与Standalone模式部署

    上节中简单的介绍了Spark的一些概念还有Spark生态圈的一些情况,这里主要是介绍Spark运行模式与Spark Standalone模式的部署: Spark运行模式 在Spark中存在着多种运行模 ...

  9. MVC中部分视图调用方法总结

    部分视图不走  controller @Html.Partial(“_Menu”);  //这种是不走Controller的,直接在加载_Menu的视图 @Html.Partial(“_Menu”, ...

  10. Linux shell redirect

    Learn much from here Learn much from here