首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > JavaScript >

新手 求个JS 点击单选按钮 显示2个不同DIV,该怎么解决

2012-04-08 
新手 求个JS 点击单选按钮 显示2个不同DIV新手 求个JS 点击单选按钮 显示2个不同DIV[解决办法]HTML codei

新手 求个JS 点击单选按钮 显示2个不同DIV
新手 求个JS 点击单选按钮 显示2个不同DIV

[解决办法]

HTML code
    <input name="radio1" type="radio" onclick="showDiv('radioDIV1')"/><input name="radio2" type="radio" onclick="showDiv('radioDIV2')"/><div id="radioDIV1" style="display:none;">    radio1 content</div><div id="radioDIV2" style="display:none;">    radio2 content</div><script type="text/javascript">    function showDiv(objID){        var divID = document.getElementById(objID);                 //判断DIV显示状态 要是显示的就隐藏,隐藏的就显示        if(divID.style.display=="block"){              divID.style.display="none"                }else{              divID.style.display="block"           }    }</script>
[解决办法]
[code=HTML][/code]<input type="radio" name="sex" id="man" onclick="show()">男
<input type="radio" name="sex" id="woman" onclick="show()">女
<div style="display:none" id="div1">
<p>第一个DIV!</p>
</div>
<div style="display:none" id="div2">
<p> 第二个DIV!</p>
</div>

<script>
function show(){
if(document.getElementById("man").checked){
document.getElementById("div1").style.display="block";
document.getElementById("div2").style.display="none";
}else if(document.getElementById("woman").checked){
document.getElementById("div2").style.display="block";
document.getElementById("div1").style.display="none";
};
};
</script>

热点排行
Bad Request.