`

Jquery实现全选和全不选

 
阅读更多

<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>My JSP 'index.jsp' starting page</title>
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->
	<script src="js/jquery-1.6.1.min.js">
		
	
	</script>
  </head>
  
  <body>
    
    <table id="dataTab">
    <tr>
    	<th>
    		<input type="checkbox"  id="selectCheck" onclick="selectAll();" value="test"/>
    	</th>
    </tr>
    	<tr>
    		<td>
    		<input type="checkbox" name="box" >
    		</td>
    		<td>
				####    		
    		</td>
    		<td>
    		<input type="checkbox" name="box">
    		</td>
    		<td>
				####    		
    		</td><td>
    		<input type="checkbox"  name="box">
    		</td>
    		<td>
				####    		
    		</td>
    	</tr>
    </table>
    
    <hr/>
    
    
     <table id="dataTab_1">
    <tr>
    	<th>
    		<input type="checkbox"  id="selectCheck_1" onclick="selectAll_1();" value="test" checked="false"/>
    	</th>
    </tr>
    	<tr>
    		<td>
    		<input type="checkbox"  >
    		<input type="checkbox"  id="testBox" value="复选框" >
    		</td>
    		<td>
				####    		
    		</td>
    		<td>
    		<input type="checkbox" >
    		</td>
    		<td>
				####    		
    		</td><td>
    		<input type="checkbox">
    		</td>
    		<td>
				####    		
    		</td>
    	</tr>
    </table>
  </body>
</html>

<script>
	function selectAll(){
			//alert($("#selectCheck").attr("checked"));
			$.each($("input[name='box']"),function(){
				if($("#selectCheck").attr("checked")){
				$(this).attr("checked",$("#selectCheck").attr("checked"));
				}
				else{
					$(this).removeAttr("checked");
					}
				});

		}

	function selectAll_1(){
		var isChecked=$("#selectCheck_1").attr("checked");
		$("#dataTab_1 tr:gt(0) :checkbox").each(function(){
				if(isChecked){
					$(this).attr("checked","checked");
			}
			else{
				$(this).removeAttr("checked");
				}
			});

		}


</script>
 
分享到:
评论

相关推荐

    jquery实现checkbox的全选和全不选

    jquery实现全选和全不选,只要有一个复选框没有选中,全选框不选中;

    jquery实现全选和全不选功能效果的实现代码【推荐】

    下面小编就为大家带来一篇jquery实现全选和全不选功能效果的实现代码【推荐】。小编觉得挺不错的,现在分享给大家,也给大家做个参考

    TreeView控件全选和全不选的JQuery代码

    JQuery代码实现了TreeView控件中CheckBox的全选和全不选功能。参考了网络资料,增加了子节点选择 判断,当所有子节点没有全部被选时,使其父节点为没被选,否则,父节点为被选。

    bootstrap+jQuery 实现下拉菜单中复选框全选和全不选效果

    主要给大家介绍了关于利用bootstrap+jQuery 实现下拉菜单中复选框全选和全不选效果的相关资料,文中给出了完整的示例代码供大家参考学习,对大家具有一定的参考学习价值,需要的朋友下面来一起看看吧。

    一天搞定jQuery(三)——使用jQuery完成复选框的全选和全不选

    一天搞定jQuery(三)——使用jQuery完成复选框的全选和全不选

    纯jquery实现的下拉复选组件.rar

    jquery实现的下拉复选框,实现全选和全不选功能,复选内容不可编辑,初学js和css的同学可以借鉴

    JQuery实现简单的复选框树形结构图示例【附源码下载】

    父节点未选中,则下面的所有的子节点也取消选中(全选和全不选) 3.选中一个子节点时相应的父节点也选中;当所有的子节点都没有选中时,父节点也取消选中 这是实现的最简单的功能。下面来具体的谈谈具体的实现: 1....

    html+javascript+bootstrap实现层级多选框全层全选和多选功能

     但是,考虑到如果要做一个选项数不确定、可能非常多,用标签会容易视觉疲劳,同时要求随着选项数的变化,最小程度影响网页布局和效果,于是选择用层级的多选框,也就是设置电脑的那种常见效果。第二层选项可以折叠...

    jQuery UI MultiSelect 多选下拉框

    1.全选和全不选,如效果图中第3部分 checkAllText 默认值:check all uncheckAllText 默认值:uncheck all $("select").multiselect({ checkAllText: "全选", uncheckAllText:"全不选" }); ...

    day04-jq.zip

    通过jQuery实现部分网页功能包括 01-网页定时弹出广告 02-表格的隔行换色 03-全选和全不选 04-省市联动效果 05-下拉列表左右选择

    jquery multiSelect

    实现下拉多选,因为用不到全选和全不选,我将其隐藏了,有什么不明白的联系QQ908028664 想要获得必须留下点什么,象征性要1分,毕竟我花费了时间才调出来的。各文件版本真是弄死人呀。

    Element-UI+Vue模式使用总结

    项目框架 Element-ui+Vue+jQuery+Bootstrap+Echarts。 嵌入vue使用的是[removed],没有使用vue-cli,请自行将内...style&gt;内代码贴入样式表。 checkbox全选和全不选 地电阻率选项:&gt; 全选 &lt;el-checkbox-gr

Global site tag (gtag.js) - Google Analytics