jQuery 的全选（全非选），取得被选中的值

最新推荐文章于 2018-08-09 09:48:03 发布

原创最新推荐文章于 2018-08-09 09:48:03 发布 · 169 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#jQuery #旅游 #ViewUI

jQuery 专栏收录该内容

11 篇文章

订阅专栏

<!-- jQuery全选(全不选择) -->
<form action="">
	<table>
		<tr>
			<td><input type="checkbox" name="checkName" value="旅游" onclick="unCheckAll(this,'allCheckName')"/>&nbsp;旅游&nbsp;</td>
		</tr>
		<tr>
			<td><input type="checkbox" name="checkName" value="看书" onclick="unCheckAll(this,'allCheckName')"/>&nbsp;看书&nbsp;</td>
		</tr>
		<tr>
			<td><input type="checkbox" name="checkName" value="上网" onclick="unCheckAll(this,'allCheckName')"/>&nbsp;上网&nbsp;</td>
		</tr>
		<tr>
			<td><input type="checkbox" name="allCheckName" onclick="checkAll(this,'checkName')"/>&nbsp;全选</td>
		</tr>
		<tr>
			<td><input type="button" value="取得被选中的值" onclick="checkedValue()"/></td>
		</tr>
	</table>
</form>

/*
 * 绑定批量选定/非选
 * object:点击的对象
 * checkName:checkBox的名称
 */
function checkAll(object,checkName){
	var bool = $(object).attr("checked");
	$(":checkbox[name='"+checkName+"']").attr("checked",bool);
}
function unCheckAll(object,allCheckName){
	var bool = $(object).attr("checked");
	if(bool == false){
		$(":checkbox[name='"+allCheckName+"']").attr("checked",bool);
	}
}
function checkedValue(){
	$(":checkbox[name='checkName']").each(function(){
		var name = $(this).val();
		alert(name);
	});
}