Maison > interface Web > js tutoriel > Js implémente la sélection complète frontale et la sélection inversée

Js implémente la sélection complète frontale et la sélection inversée

一个新手
Libérer: 2017-09-26 14:13:16
original
1862 Les gens l'ont consulté

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script>
			
			window.onload = function(){
				selAll = document.getElementById("selAll");
				hobbys = document.getElementsByName("hobby");
				fx = document.getElementById("fx");
				
				//全选事件
				selAll.onclick = function(){
					//全选
					if(selAll.checked == true){
						for (var i=0;i<hobbys.length;i++) {
							hobbys[i].checked = true;
						}
					}else{
						for (var i=0;i<hobbys.length;i++) {
							hobbys[i].checked = false;
						}
					}
				}
				
				
				//反选
				fx.onclick = function(){
					
					for (var i=0;i<hobbys.length;i++) {
							var b = hobbys[i];
							if(b.checked == true){
								b.checked = false;
							}else{
								b.checked = true;
							}
						}
				}
				
			}
			
			
			
		</script>
	</head>
	<body>
		<input type="checkbox" name="" id="selAll" />全选
		<button id="fx">反选</button>
		<br>
		<input type="checkbox" name="hobby" />篮球
		<input type="checkbox" name="hobby" />足球
		<input type="checkbox" name="hobby" />乒乓球
		<input type="checkbox" name="hobby" />羽毛球
	</body>
</html>
Copier après la connexion

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal