jquery_笔记（父子checkbox，条件选择）

最新推荐文章于 2024-04-13 18:31:23 发布
最新推荐文章于 2024-04-13 18:31:23 发布
阅读量9.1k 收藏
点赞数
分类专栏： jquery
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/woshirongshaolin/article/details/8284736
版权 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
<meta charset=utf-8 />  
<!--[if IE]>  
  <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>  
<![endif]-->  
 <script class="jsbin" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>  
<script type="text/javascript">
function SelectBox(){
	$("input[type=checkbox]").attr("checked","checked");
	}
	function UnSelectBox(){
	$("input[type=checkbox]").attr("checked",null);
	}
	//----------------非常神奇而又简单的----------------
	function goSelect(id){
			var arr = id.split("_");
			var superid = arr[0] + "_"+ arr[0];
			//alert("测试"+arr[0]+"    "+arr[1]);
			if(arr[0] != arr[1]){
				//如果点击子类复选框，则父类的复选框处于选中状态
				if($("#"+id)[0].checked){
					//组织父类id
					$("#"	+ superid).attr("checked","checked");
				}else{
					var flag = false;
					//过滤选择1，checkbox2，以arr[0]开头，3，不以arr[0]结尾的checkbox
					var $child = $("input[type = checkbox][id ^="+arr[0]+" ]:not([id $="+arr[0]+"])");
					$child.each(function(index,DomEle){
					//	alert();
						if(this.checked){
							flag = true;
							return;
						}
					});
					
					if(!flag){
						$("#"+superid).attr("checked",null);
					}
				}
			}

					if(arr[0] == arr[1]){
						if($("#"+id)[0].checked){
					//	alert("yyy");
							$("input[type = checkbox][id ^="+arr[0]+"]").attr("checked","checked");
						}else{
								$("input[type = checkbox][id ^="+arr[0]+"]").attr("checked",null);
						}
					}
	}
</script>
<style>  
  article, aside, figure, footer, header, hgroup,   
  menu, nav, section { display: block; }  
</style>  
  <title>rsl </title>
 </head>

 <body>
<table>
<tr>
	<td>
<input type="button" value="全选" οnclick="SelectBox();">
<input type="button" value="全不选" οnclick="UnSelectBox();">
	</td>
</tr>
<tr>
	<td>
	<fieldset>
		<legend>
			<input type="checkbox" name="menuModule" value="company,company" id="company_company" onClick="goSelect(this.id);" title="客户管理" >客户管理
		</legend>
		<div id="" class="">
					<input type="checkbox" name="menuModule" value="company,base" id="company_base" onClick="goSelect(this.id);" title="客户拜访" >客户拜访
		</div>
		<div id="" class="">
					<input type="checkbox" name="menuModule" value="company,linkMan" id="company_linkMan" onClick="goSelect(this.id);" title="联系人" >联系人
		</div>
		<div id="" class="">
				<input type="checkbox" name="menuModule" value="company,linkTouch" id="company_linkTouch" onClick="goSelect(this.id);" title="联系记录" >联系记录
		</div>
		<div id="" class="">
				<input type="checkbox" name="menuModule" value="company,rule" id="company_rule" onClick="goSelect(this.id);" title="客户设置" >客户设置
		</div>
	</fieldset>
	</td>
</tr>
<tr>
	<td>
		<fieldset width="888">
		<legend>
			<input type="checkbox" name="menuModule" value="report,report" id="report_report" onClick="goSelect(this.id);" title="报表分析" >报表分析
		</legend>
		<div id="" class="">
					<input type="checkbox" name="menuModule" value="report,kufx" id="report_kufx" onClick="goSelect(this.id);" title="客户分析" >客户分析
		</div>
		<div id="" class="">
					<input type="checkbox" name="menuModule" value="report,kufl" id="report_kufl" onClick="goSelect(this.id);" title="客户分类" >客户分类
		</div>
			</td>
	</fieldset>
</tr>
</table>
 </body>
</html>

加木Go
关注
专栏目录
jQuery_学习笔记，家中常备
Chill Lyn
11-28 213
最最最基本的使用 获得/更改双标记标签中的内容 $("span").text(); $("span").text("abc"); 获得/更改单标记标签中内容 $("input").val(); $("input").val("abc"); 数组的each遍历 var arr=$(...); arr.each(function(){ //each one does something... }...
jQuery 学习笔记 黑马
HGKIVD的博客
10-31 254
jQuery学习笔记
选中一级复选框，相关二级或父级同时被选，取消也是
10-08
选中一级复选框，相关二级或父级同时被选，取消也是
[jQuery]操作具有父子关系的复选框
Konaji
06-29 7747
[jQuery]操作具有父子关系的复选框
多级 checkbox 父子类关联勾选
团子窝
09-07 5281
场景 设定用户组的时候需要勾选节点，多级节点的情况很多 解决 jq使用 1.6 左右的。 jqery.checktree.js ; (function (win, doc, $) { $.fn.extend({ checktree : function () { this.click(function (evt) { var evtEle = $(evt.
ztree，实现父子checkbox关联
cacalili的博客
01-18 1327
应用场景：做权限管理，报表功能下面有周报表，月报表，季报表，年报表，勾选报表功能自动勾选其下的四个功能，勾选报表功能下的任一个功能以上，自动勾选报表功能，然后把id传到后台，进行你想做的操作js及css如下（我用的是v3版）权限管理 $(document).ready(function(){        var setting = {              check: {        
获取选定CheckBox控件的值及js实现勾选时勾选相关父子关系
binzai325的专栏
09-07 6397
页面代码如下： '
jQuery笔记
彳亍
11-28 665
1. 简介jQuery是一个JavaScript库，它通过封装原生的JavaScript函数得到一整套定义好的方法。优点： 操作起来非常方便 浏览器的兼容性很好 有大量基于jQuery的插件 1.1. 代码风格在jQuery中，不管是页面元素的选择还是内置功能函数的使用，都是用美元符号“$”来起始的。$(function(){ }); //执行一个匿名函数 $('#box');
JQuery学习笔记
kianagrow的博客
05-15 1179
jQuery是一个快速、简洁的JavaScript框架，封装JavaScript常用的功能代码，提供一种简便的JavaScript设计模式，优化HTML文档操作、事件处理、动画设计和Ajax交互。
jQuery学习笔记——jQuery选择器
vikeyyyy的博客
08-20 427
jQuery选择器之基本选择器 jQuery选择器——id选择器 $( "#id" ) id选择器也是基本的选择器，jQuery内部使用JavaScript函数document.getElementById()来处理ID的获取。原生语法的支持总是非常高效的，所以在操作DOM的获取上，如果能采用id的话尽然考虑用这个选择器。 id是唯一的，每个id值在一个页面中只...
jquery 选择父级子级权限
11-09
选中父级时，所有子全选中。子级取消选择时，当同级没有一个选中时，则其父级也取消选中，如果还有一个子级被选中，则不影响父级的选中状态
CheckBox 选中效果 选中子的父自动选中,选中父的子全部选中
01-21
CheckBox 选中效果 选中子的父自动选中,选中父的子全部选中 适用于C:Foreach 读取${list} 然后选中的选项添加到数据库
JS实现选中一级复选框相关二级或父级同时被选
12-03
JS实现选中一级复选框相关二级或父级同时被选;子级全部选中，父级自动选中；父级选中，子级全部选中。做权限功能可用到。html页面。
Ext.net TreePanel的Checkbox操作及父子节点联动（修正）
08-29
TreePanel的checkbox节点操作及父子节点联动的演示DEMO，前面那个有Bug，选中子节点时，没能选择父节点。 这个版本修正了
jquery实现复选框联动
daxiang的专栏
04-27 9266
input1 input2 input3 input4 $('input[type="checkbox"]').click(function(){ // 获取当前复选框在所有复选框中索引 var index = $('input[type="checkbox"]').index(this); var arrStage = ['input4','input3','inp
span标签模拟input checkbox实现父子级选中同步，vuejs数据绑定
Y_东东的博客
03-21 2128
&lt;!DOCTYPE html&gt; &lt;html lang="en"&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;Document&lt;/title&gt; &lt;script src="https://unpkg.com/vue@2.4.4
开发需求15-使用el-checkbox组件实现el-tree组件的父子关联关系（非全选/全不选）
最新发布
Mr_LiuP的博客
04-13 612
使用el-checkbox组件实现el-tree组件的父子关联关系（非全选/全不选）
一段关于父子功能checkbox选择的javascript
人生就得折腾
07-12 405
function subFunctionState(chkid, state) {        var chkcount = document.form1.functionID.length;        for (var i = 0; i &lt; chkcount; i++) {            var subFun = document.form1.functionID[i];  ...
checkbox 子级父级联动
u013195452的专栏
08-16 913
1.点击父级取消，子级全部取消； 2.点击任意一个子级checked，父级自动checked； 3.里面的value的值和内容自己根据情况修改，我这里是从后台拿到的数据； '+L2Source[i].name+'                  <input type="checkbox" class="ziji checkSource" value="'+L2Sourc
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值