JavaScript 控制 checkbox

原创于 2010-05-14 09:47:00 发布 · 546 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #input #button #function

javascript 专栏收录该内容

25 篇文章

订阅专栏

本文介绍了一个简单的HTML页面结合JavaScript实现的功能：通过一个总开关控制一组复选框的全选与全不选状态，并且可以通过按钮来切换每个复选框的状态。此功能在网页表单中十分常见。

<html>
<mce:script type="text/javascript"><!--
	function checkedAll(checked)
	{
		var ckbArray=document.getElementsByName('ckb');
		for(var i=0,len=ckbArray.length;i<len;i++)
		{
				 ckbArray[i].checked=checked;
		}
	}

	function clickbutton()
	{
		var ckbArray=document.getElementsByName('ckb');
		for(var i=0,len=ckbArray.length;i<len;i++)
		{
			if (ckbArray[i].checked == true)
			{
				ckbArray[i].checked = false;
			}
			else
			{
				ckbArray[i].checked = true;
			}
		}
	}
// --></mce:script>
<body>
	<input type='checkbox' onclick='checkedAll(this.checked);' />
	<input type='button' value ='check' onclick="clickbutton();">
	<input type='checkbox' name='ckb'/>1 
	<input type='checkbox' name='ckb'/>2
	<input type='checkbox' name='ckb'/>3
	<input type='checkbox' name='ckb'/>4
	<input type='checkbox' name='ckb'/>5
	<input type='checkbox' name='ckb'/>6
</body>
</html>