关于动态显示隐藏div

来源:百度知道 编辑:UC知道 时间:2024/07/02 01:07:33
//-----html code-------------
<div id="option">
<a href="#ip">ip地址查询</a>
<a href="#pho">手机归属地查询</a>
<a href="#">邮编查询</a>
<a href="#">身份证查询</a>
</div>
<div id="operator">
<div id="ip">
<input id="Text1" type="text" value="请录入IP地址" />
</div>
<div id="pho">
<input id="Text2" type="text" value="请录入手机号码" />
</div>
</div>

//------css code----------------------
.hideCss
{
/*display:none; */
visibility:hidden;
}
.showCss
{
/*display:block;*/
visibility:visible;
}
//-------js code-------------------------------<

如果你使用的是jquery的话.我建议你这样使用:
//-------js code-------------------------------

//显示对象
function ShowObj(obj){
$(obj).show();
}
//隐藏对象
function HideObj(obj){
$(obj).hide();
}
//隐藏operator
function HideOperator(){
$("#operator div").hide();
}

$(function(){
HideOperator();
var objDivs=$("#option a");
objDivs.click(function(){
HideOperator();
var divName=$(this).attr("href");
ShowObj($(divName));
});
});