<!DOCTYPE?html>
<html>
<head>
????<meta?charset="UTF-8">
????<title>實踐題?-?選項卡</title>
????<style?type="text/css">
????ul,li,div{margin:0;
????padding:0;
????????}
????????a{
????????????text-decoration:none;
????????????color:black;
????????????border:1px?solid?;
????????????padding:5px;
????????}
????????ul{
????????????list-style:none;
????????????
????????????
????????}
????????li{margin:10px;
????????????display:inline;
????????????font-weight:bold;
????????????font-size:20px;
????????}
??????div{width:200px;
??????height:180px;
??????border:1px?solid?rgb(100,200,150);
??????padding-right:40px;
??????padding-left:10px;
??????margin:10px;
???????????????}?
??????#box1{
??????????
??????}
??????#box2{
?????????display:none;
??????}
??????#box3{
??????????
?????????display:none;
??????}
???????
????</style>
????<script?type="text/javascript">
?????????
????//?JS實現選項卡切換
????function?a(b){
????????switch(b.innerHTML){
????????????case?"房產":var?c=document.getElementById("box2");
??????????????????var?d=document.getElementById("box3");
??????????????????var?e=document.getElementById("box1");
??????????????????c.style.display="none";
??????????????????d.style.display="none";
??????????????????e.style.display="block"
??????????????????break
????????????case?"家居":var?c=document.getElementById("box1");
??????????????????var?d=document.getElementById("box3");
??????????????????var?e=document.getElementById("box2");
??????????????????c.style.display="none";
??????????????????d.style.display="none";
??????????????????e.style.display="block"
??????????????????break
????????????case?"二手房":var?c=document.getElementById("box1");
??????????????????var?d=document.getElementById("box2");
??????????????????var?e=document.getElementById("box3");
??????????????????c.style.display="none";
??????????????????d.style.display="none";
??????????????????e.style.display="block"
??????????????????break
????????}
????}
????
????</script>
?
</head>
<body>
<!--?HTML頁面布局?-->
<ul?>
<li><a?href="javascript:a(this);">房產</a></li>
<li><a?href="javascript:a(this);">家居</a></li>
<li><a?href="javascript:a(this);">二手房</a></li>
????
</ul>
<div?id="box1">275萬購昌平鄰鐵三居?總價20萬買一居
?????200萬內購五環三居?140萬安家東三環
?????北京首現零首付樓盤?53萬購東5環50平
?????京樓盤直降5000?中信府?公園樓王現房</div>
<div?id="box2">40平出租屋大改造?美少女的混搭小窩
??????經典清新簡歐愛家?90平老房煥發新生
??????新中式的酷色溫情?66平撞色活潑家居
??????瓷磚就像選好老婆?衛生間煙道的設計</div>
<div?id="box3">通州豪華3居260萬?二環稀缺2居250w甩
??????西3環通透2居290萬?130萬2居限量搶購
??????黃城根小學學區僅260萬?121平70萬拋!
??????獨家別墅280萬?蘇州橋2居優惠價248萬</div>
?
</body>
</html>
為什么我的無法實現選項卡切換，大神給看看
qq_安仁斗辣椒_0
2015-08-29 17:19:46
