javascript 动态控制复选框的选择和取消

这里就需要引入一个jquery-1.4.2.js 就行了,因为用到了里面的选择器

<html>
<head>
<script type="text/javascript" src="jquery-1.4.2.js"></script>
<script type="text/javascript">
 	function CheckBox(){
		var outupType = $('input[name="outupType"]:checked').val();	
		var outuparray = $('input[name="outupType"]').length;
		var i=0;
		var scheck = 	$('input[name="outupType"]')[i].checked;
		var scheck1 = 	$('input[name="outupType"]')[i+1].checked;
		var scheck2 =	$('input[name="outupType"]')[i+2].checked;
		var scheck3 =	$('input[name="outupType"]')[i+3].checked;
		var scheck4 =	$('input[name="outupType"]')[i+4].checked;
		if(scheck == true ){
			$('input[name="outupType"]')[i+1].checked = true;
			$('input[name="outupType"]')[i+2].checked = true;
			$('input[name="outupType"]')[i+3].checked = true;
			$('input[name="outupType"]')[i+4].checked = true;
		}else{
			$('input[name="outupType"]')[i+1].checked = false;
			$('input[name="outupType"]')[i+2].checked = false;
			$('input[name="outupType"]')[i+3].checked = false;
			$('input[name="outupType"]')[i+4].checked = false;
		}
		

		
	}
	
	function CheckBoxs(){
		var i=0;
		var scheck = 	$('input[name="outupType"]')[i].checked;
		var scheck1 = 	$('input[name="outupType"]')[i+1].checked;
		var scheck2 =	$('input[name="outupType"]')[i+2].checked;
		var scheck3 =	$('input[name="outupType"]')[i+3].checked;
		var scheck4 =	$('input[name="outupType"]')[i+4].checked;
	
		if(scheck1==true && scheck2 == true && scheck3 == true && scheck4 == true){
			$('input[name="outupType"]')[i].checked  = true;
		}else{
			$('input[name="outupType"]')[i].checked  = false;
		}
	}
</script>
</head>
<body>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<!-- 出力内容  BEGIN -->
		<tr height="25" class="tyouhyou_8pt">
		<td bgcolor="#FFB56A" width="65" align="center">出力内容</td>
		
		<td align="left">	
			<table>
			<tr>
				<td width="90"><input type="checkbox" onclick="CheckBox()" name="outupType" value="1" />全項目選択</td>
			</tr>
			<tr>
				<td width="90"><input type="checkbox" onclick="CheckBoxs()" name="outupType" value="2" />個人情報</td>
			</tr>
			<tr>
				<td width="90"><input type="checkbox" onclick="CheckBoxs()" name="outupType" value="3" />緊急連絡先</td>
			</tr>
			<tr>
				<td width="90"><input type="checkbox" onclick="CheckBoxs()" name="outupType" value="4" />金融機関</td>
			</tr>
			<tr>
				<td width="160"><input type="checkbox"  onclick="CheckBoxs()"name="outupType" value="5" />職業 服・靴のサイズ</td>
			</tr>
			</table>
		</td>
		</tr>
		</body>
	<!-- 出力内容  END -->
	</html>

  

原文地址:https://www.cnblogs.com/sunxun/p/4447839.html