您的位置:首页 > Web前端 > JavaScript

js

2015-12-19 07:37 567 查看
<!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>

<style>
#Eroup{display:none;}
#Aria{display:none;}
#Eoop{display:none;}
</style>

</head>

<body>
<input type="checkbox" name="Eroup" onclick="show(this)" />Eroup
<input type="checkbox" name="Aria" onclick="show(this)" />Aria
<input type="checkbox" name="Eoop" onclick="show(this)" />Eoop
<div id="content">
<div id="Eroup">
<script>
var Eroup=['A','B','C','D'];
for(var i=0;i<Eroup.length;i++){
document.write('<input type="checkbox" />'+Eroup[i]);
}
</script>
</div>
<div id="Aria">
<script>
var Aria=['E','F','G','H'];
for(var i=0;i<Aria.length;i++){
document.write('<input type="checkbox" />'+Aria[i]);
}
</script>
</div>
<div id="Eoop">
<script>
var Eoop=['I','J','K','L'];
for(var i=0;i<Eoop.length;i++){
document.write('<input type="checkbox" />'+Eoop[i]);
}
</script>
</div>
</div>
<script>
var cdivs=document.getElementById("content").getElementsByTagName("div");
function show(obj){
switch(obj.name){
case "Eroup":
cdivs[0].style.display="block";
cdivs[1].style.display="none";
cdivs[2].style.display="none";
break;
case "Aria":
cdivs[1].style.display="block";
cdivs[0].style.display="none";
cdivs[2].style.display="none";
break;
case "Eoop":
cdivs[2].style.display="block";
cdivs[0].style.display="none";
cdivs[1].style.display="none";
break;
}
}
</script>
</body>
</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: