您的位置:首页 > 其它

隐藏DIV 显示DIV

2010-01-12 09:36 204 查看
  昨天做项目,用到了隐藏和显示DIV,在页面加载的时候,默认隐藏,当触发一个服务器控件时,显示此DIV,然后对此操作完成后,在点击DIV上服务器控件隐藏DIV,方法很简单,可以用客户端控件,同样的道理。

  下面就把代码贴出来。

第一设置CSS

<style type="text/css">

.selectName

{

margin-left: 30%;

width: 150px;

height: 150px;

margin-top: 30px;

position: absolute;

background-color: #eef6ff;

z-index: 0;

display: none;

}

</style>

第二是DIV

<!--DIV 默认隐藏-->

<div id="divBatchName" class="selectName">

<div style="height: 50px; margin-top: 20px;">

<label>

批次名称</label>

<asp:DropDownList ID="ddlSelectBatchName" runat="server" AutoPostBack="true" >

</asp:DropDownList>

</div>

<div style="margin-top: 20px">

<asp:Button ID="btnDivBatchSure" runat="server" Text="确定" CssClass="btn_bg" ToolTip="确定"

OnClientClick="divHideBatchName()" />

</div>

</div>

<!--End DIV 默认隐藏-->

第三 JS脚本

<script language="javascript" type="text/javascript">

//显示 div

function divShowBatchName() {

var showBatchName = document.getElementById("divBatchName");

showBatchName.style.display = 'block';

}

//隐藏 div

function divHideBatchName() {

var hideBatchName = document.getElementById("divBatchName");

hideBatchName.style.display = 'none';

}

</script>

触发显示DIV服务器控件

<asp:Button ID="btnGivenBatch" runat="server" Text="显示DIV" OnClientClick="divShowBatchName()" />

就这些代码 ,样式大家可以自行设计。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: