zoukankan      html  css  js  c++  java
  • 选择框

    有一些按钮,实现全选,反选,不选

    <!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=utf-8" />
    <title>选择框</title>
    <script>
    window.onload=function (){
    	var oBtn1=document.getElementById('btn1');
    	var oBtn2=document.getElementById('btn2');
    	var oBtn3=document.getElementById('btn3');
    	var oDiv=document.getElementById('div1');
    	var aCh=oDiv.getElementsByTagName('input');
    	oBtn1.onclick=function (){//全选
    		for(var i=0;i<aCh.length;i++){//for循环将所有的选择框变为true
    		 aCh[i].checked=true;
    		 }
    		};
    	oBtn2.onclick=function (){//不选
    		for(var i=0;i<aCh.length;i++){//for循环将所有的选择框变为false
    		 aCh[i].checked=false;
    		 }
    		};
    	oBtn3.onclick=function (){//反选
    		for(var i=0;i<aCh.length;i++){//for循环将true变为false,将false变为true
    			if(aCh[i].checked==true){
    				aCh[i].checked=false;
    				}else{
    					aCh[i].checked=true;
    					}
    		 
    		 }
    		};
    	};
    </script>
    </head>
    
    <body>
    <input id="btn1" type="button" value="全选"/>
    <input id="btn2" type="button" value="不选"/>
    <input id="btn3" type="button" value="反选"/>
    <div id="div1">
    <input type="checkbox"/><br>
    <input type="checkbox"/><br>
    <input type="checkbox"/><br>
    <input type="checkbox"/><br>
    <input type="checkbox"/><br>
    <input type="checkbox"/><br>
    <input type="checkbox"/><br>
    <input type="checkbox"/><br>
    <input type="checkbox"/><br>
    <input type="checkbox"/><br>
    <input type="checkbox"/><br>
    <input type="checkbox"/><br>
    </div>
    </body>
    </html>
    
  • 相关阅读:
    Java内部类与外部类的那些事
    TCP那些事
    Java的垃圾回收和内存分配策略
    HTTP的客户端识别与cookie机制
    HTTP缓存
    HTTP连接管理
    Java Native Interface 六JNI中的异常
    Java Native Interface 五 JNI里的多线程与JNI方法的注册
    Java Native Interface 四--JNI中引用类型
    Java Native Interfce三在JNI中使用Java类的普通方法与变量
  • 原文地址:https://www.cnblogs.com/lzzhuany/p/4596120.html
Copyright © 2011-2022 走看看