jquery操作checkbox

checkbox操作

1. 全选、全不选

2.打印所有的选中项目

jquery操作checkbox_第1张图片

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  <title>  </title>
  <script type="text/javascript" src="jquery-1.3.2.js"></script>
  <script>
	// 全选、全不选
	function docChkBoxChange(){
		 var isChecked = jQuery('#docChkBoxTop').attr('checked');
		 // 设置以下所有的 checkBox 列表
		 jQuery("input[name=docChkBox]").each(function(){
			this.checked = isChecked;
		 });
	}//end function
	// 打印所有的选中项目
	function printChoose(){
		 var isChecked = jQuery('#docChkBoxTop').attr('checked');
		 // 设置以下所有的 checkBox 列表
		 jQuery("input[name=docChkBox]").each(function(){
			if(this.checked){
				alert(this.value)
			}
		 });
	}//end function
  </script>
 </head>

 <body>
  <table>
	<tr>
		<td>
			<input id='docChkBoxTop' type="checkbox" onClick='docChkBoxChange()'>全选、全不选
		</td>
	</tr>
	<tr>
		<td>
			<input name='docChkBox' type="checkbox"  value='apple'>苹果
		</td>
	</tr>
	<tr>
		<td>
			<input name='docChkBox' type="checkbox"  value='banana'>香蕉
		</td>
	</tr>
	
	<tr>
		<td>
			<input  type="button"  value='打印所有选中项' onClick='printChoose()'>
		</td>
	</tr>
  </table>
 </body>
</html>


你可能感兴趣的:(jquery操作checkbox)