请给我一段代码,谢谢。如何在相同区域点击不同按钮,出现不同内容。

如图所示,点击“热销宝贝”在下面的区域出现这些图片。如果点击“最新上架”,在同样的区域出现另外的图片,有高手能给段代码吗?或者用什么html标签可以做到?... 如图所示,点击“热销宝贝”在下面的区域出现这些图片。如果点击“最新上架”,在同样的区域出现另外的 图片,有高手能给段代码吗?或者用什么html标签可以做到? 展开
 我来答
ping3108
2014-12-22 · TA获得超过551个赞
知道小有建树答主
回答量:205
采纳率:0%
帮助的人:137万
展开全部

把下面的代码保存成html文件,双击打开,你就能看到效果。

<html>
<head>
<meta charset="gb2312">
<title>点击不同按钮出现不同内容</title>
<script type="text/javascript">
function show(num)
{
for(var i=1; i<=4; i++)
{
document.getElementById("d"+i).style.display="none";
}
document.getElementById("d"+num).style.display="block";
}
</script>

<style type="text/css">
#btns
{
margin: 12px;
}

#ctn
{
margin: 12px;
width: 400px;
height: 360px;
position: relative;
}
div.holder
{
width: 400px;
height: 360px;
position: absolute;
top: 0;
left: 0;
padding-left: 20px;
padding-top: 30px;
}

#d1
{
background-color: #edc;
}

#d2
{
background-color: #abc;
}

#d3
{
background-color: #a3e;
}

#d4
{
background-color: #5cc;
}

</style>

<head>

<body onload="show(1);">

<div id="btns">
<button id="btn1" onclick="show(1);">热销宝贝</button>
<button id="btn2" onclick="show(2);">最新上架</button>
<button id="btn3" onclick="show(3);">热门搜索</button>
<button id="btn4" onclick="show(4);">人气宝贝</button>
</div>

<div id="ctn">
<div id="d1" class="holder">
热销宝贝
</div>
<div id="d2" class="holder">
最新上架
</div>
<div id="d3" class="holder">
热门搜索
</div>
<div id="d4" class="holder">
人气宝贝
</div>
</div>

</body>
</html>
追问
非常感谢,能告诉我你的QQ吗?我想咨询你几个问题。可以吗?
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式