您的位置：首页 > Web前端 > JavaScript

js实现多个checkbox至少选择一个的判断

2015-05-28 16:31 465 查看
最近遇到多个checkbox至少选中一个才能submit的判定。百度了很久没找到一个简单易懂的，没找到一个能让我看得懂的（本人菜鸟，看不懂大神们的方法）。研究了N久终于用通俗易懂的方法实现。我是用checkbox的id实现的，所以id命名时最好有点规律以方便在for loop里面轻易实现。如果没有选中一个就点击Apply，则会弹出提示，且不会submit。记忆力不好，写此笔记仅做个人经验积累用。

<html>
<head>
<META http-equiv="Content-Type" content="text/html; charset=UTF-8">

<title>Cable Diagnostic</title>
<script>
function CheckBoxChs(){
var obj;
var objYN=false;
var i;
	for(i=1; i <= 8;i++)
	{
		obj = document.getElementById("p"+i+"");
		if(obj.checked==true){
			objYN= true;
			break;
		}
	}
	return objYN;
}

function apply()
{
	if(CheckBoxChs()== false)
	{alert("至少选择一个.");return;}
document.forms[0].submit();
}
</script>
</head>

<body>
<form name="cable" action="" method="post">
	<table cellSpacing="0" border="0">
		<tr vAlign="top"><td width="407"><h1>Cable Diagnostic</h1></td></tr>
	</table>

	<table class="table-middle">
		<tr align="center">
			<td width="60"><b>Check</b></td>
			<td width="80"><b>Port</b></td>
			<td width="80"><b>Test Result</b></td>
			<td width="380"><b>Cable Fault Distance</b></td>
		</tr>
		<SCRIPT>
		var i;
		for(i=1; i <= 8 ;i++)
		{
			document.write("<tr align='center'>");
			document.write("<td><input type='checkbox' id='p"+i+"' name='p"+i+"' value='p"+i+"'></td>");
			document.write("<td><b>"+i+"</b></td>");

			document.write("</tr>");

		}
		</script>
	</table>
<p>
	<table>
		<tr align="center"><td width="625"><input class="button" value="Apply" type="button" onclick="apply()"></td></tr>
	</table>
</form>
</body>
</html>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航