zoukankan      html  css  js  c++  java
  • 隐藏DIV 显示DIV TC

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

      下面就把代码贴出来。

    第一设置CSS 

     <style type="text/css">

            .selectName

            {

                margin-left: 30%;

                 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()" /> 

    就这些代码 ,样式大家可以自行设计。 

    作者:Mr S.R Lee
    出处:http://www.cnblogs.com/LeeYongze
    本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利.

  • 相关阅读:
    Jquery中的this指向的是哪个对象?
    需要重新编辑
    关于CSS选择器优先级无冲突样式设置的展示
    在 CSS 中,width 和 height 指的是内容区域的宽度和高度
    关于正则表达式中分组的一些误解勘正以及String的replaceAll方法误解勘正
    关于informatica的Dynamic Lookup组件使用中遇到的一个问题的思考
    【转】Informatica Update 机制详解
    维度表和事实表的含义
    今天看IO流,复制word遇到的一个小问题
    小试下新博客,一个列传行的SQL
  • 原文地址:https://www.cnblogs.com/LeeYongze/p/1644587.html
Copyright © 2011-2022 走看看