首页 > Js/Jquery

Js实现checkbox全选在线可浏览

发表于2015-05-14 15:48:27| --次阅读| 来源webkfa| 作者小猪仔

摘要:Js实现checkbox全选在线可浏览
html代码
运行代码
<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">
    <title>webkfa.com</title>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
  </head>  
  <body>
  	<table border="1">
  		<tr>
  			<td>
  				<input type="checkbox" value="1" name="qsid" id="qsid" onclick="qsfun(this);"/>
  				全选
  			</td>
  		</tr>
  		<tr>
  			<td>
  				<input type="checkbox" value="1" onclick="checkqsfun();" name="checkname"/>
  				选择1
  			</td>
  		</tr>
  		<tr>
  			<td>
  				<input type="checkbox" value="1" onclick="checkqsfun();" name="checkname"/>
  				选择2
  			</td>
  		</tr>
  		<tr>
  			<td>
  				<input type="checkbox" value="1" onclick="checkqsfun();" name="checkname"/>
  				选择3
  			</td>
  		</tr>
  		<tr>
  			<td>
  				<input type="checkbox" value="1" onclick="checkqsfun();" name="checkname"/>
  				选择4
  			</td>
  		</tr>
  		<tr>
  			<td>
  				<input type="checkbox" value="1" onclick="checkqsfun();" name="checkname"/>
  				选择5
  			</td>
  		</tr>
  	</table>
  	<script type="text/javascript">
  		function qsfun(obj){
  			var arr=document.getElementsByName("checkname");
			for(var i=0;i<arr.length;i++){
					arr[i].checked=obj.checked;
			}
  		}
  		function checkqsfun(){
  			var arr=document.getElementsByName("checkname");
  			var bl=true;
			for(var i=0;i<arr.length;i++){
				if(!arr[i].checked){
					bl=false;
					break;
				}
			}
			if(bl){
				document.getElementById('qsid').checked=true;
			}else{
				document.getElementById('qsid').checked=false;
			}
  		}
  	</script>
  </body>
</html>

相关文章

猜你喜欢

学到老在线代码浏览器 关闭浏览
友情链接: hao123 360导航 搜狗网址导航 114啦网址导航 博客大全
Copyright © 1999-2014, WEBKFA.COM, All Rights Reserved  京ICP备14034497号-1