zoukankan      html  css  js  c++  java
  • jquery复选框

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>无标题文档</title>
    
    <script type="text/javascript" src="jquery所有版本/jquery/1.10.2/jquery-1.10.2.min.js"></script>
    <script type="text/javascript">
    $(function(){
    
    	//全选-全不选
    	$("#all").change(function (){
    		$("input[type=checkbox]").prop("checked",$("#all").is(":checked"));
    	
    	});
    	//反选
    	$("#reverse").click(function (){
    		var count = 0;
    		var size = $("input[name=che]").size();
    		//alert(size);
    		$("input[name=che]").each(function (){
    			if(this.checked){
    				$(this).prop("checked",false);
    			}else{
    				count++;
    				$(this).prop("checked",true);
    			}
    			
    		});
    		if(count == size){
    			$("#all").prop("checked",true);
    		}else{
    			$("#all").prop("checked",false);
    		}
    	});
    
    	
    });
    
    function setSelect(obj){
    	//alert(obj.checked)
    	if(obj.checked){
    		//需要判断被选中的复选框个数
    		var count = 0;
    		$(":checked").each(function (){
    			count++;
    		});
    		if(count < $("input[name=che]").size()){
    			$("#all").prop("checked",false);
    		}else{
    			$("#all").prop("checked",true);
    		}
    		
    	}else{
    		$("#all").prop("checked",false);			
    	}
    	
    	
    }
    
    </script>
    
    
    </head>
    <body>
    <input type="checkbox" id="all"> 全选
    <input type="button" value="反选" class="btn" id="reverse"> 
    <br />
    <hr />
    <input type="checkbox" name="che" value="1" onclick="setSelect(this)"> 1.时间都去哪儿了<br />
    <input type="checkbox" name="che" value="2" onclick="setSelect(this)"> 2.海阔天空<br />
    <input type="checkbox" name="che" value="3" onclick="setSelect(this)"> 3.真的爱你<br />
    <input type="checkbox" name="che" value="4" onclick="setSelect(this)"> 4.不再犹豫<br />
    <input type="checkbox" name="che" value="5" onclick="setSelect(this)"> 5.光辉岁月<br />
    <input type="checkbox" name="che" value="6" onclick="setSelect(this)"> 6.喜欢妳<br />
    <hr />
    <br />
    
    </body>
    </html>
    

      

  • 相关阅读:
    解决UITableView中Cell重用机制导致内容出错的方法总结
    Hdu 1052 Tian Ji -- The Horse Racing
    Hdu 1009 FatMouse' Trade
    hdu 2037 今年暑假不AC
    hdu 1559 最大子矩阵
    hdu 1004 Let the Balloon Rise
    Hdu 1214 圆桌会议
    Hdu 1081 To The Max
    Hdu 2845 Beans
    Hdu 2955 Robberies 0/1背包
  • 原文地址:https://www.cnblogs.com/toLife/p/4588858.html
Copyright © 2011-2022 走看看