使用jquery使div可见性为false [英] Make div visibility false using jquery

问题描述

嗨


我是Jquery的新手。



在我的应用程序中有一页说default.aspx，它有应用它的母版页。

在default.aspx 2 div控件有（div1，div2）。

div1是可见的，div2是不可见的

现在，当我点击div1中的按钮时，我想让div1可见性为false

和div2可见性为真。

我试过这段代码。< br $> b $ b

Hi
I am new to Jquery.

In my application there is one page say default.aspx,it has master page applied to it.
in default.aspx 2 div controls are there(div1,div2).
div1 is visible and div2 is invisible
Now when i click on a button in div1 then i want to make div1 visibility to false
and div2 visibility to true.
I tried this code.

<script src="jquery/jquery.js" type="text/javascript"></script>

   <script type="text/javascript">
  $(document).ready(function(){
    $("#button1").click(function(){
      $("#div1").hide();
      $("#div2").show();
    });
  });
  </script>

这个div1隐藏div2可见片刻，然后div1再次可见div2变得不可见了。



以避免我的影响

with this div1 is hiding div2 is visible for a moment and then again div1 is visible and div2 is becoming invisible.

to avoid that effect i put

return false;

此行后
div2.show（）



现在我的问题是我在button1点击事件中写了一些没有被解雇的代码。



我需要这样做的方式

请帮助我。



提前感谢您的帮助





编辑---- -----------------------------------



这是我的代码



.aspx页

-----------

after this line div2.show()

Now my problem is I wrote some code in button1 click event which is not getting fired.

In which way i need to do this
please help me.

Thanks for help in advance


EDIT ---------------------------------------

This is my code

.aspx page
-----------

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="Server">
    <script src="jquery/jquery.js" type="text/javascript"></script>

     <script type="text/javascript">
   $(document).ready(function(){
      $('#<%=btnEdit.ClientID %>').click(function(){
        $('#<%=divAddress.ClientID %>').hide();
        $('#<%=divEdit.ClientID %>').show();
        return false;
      });
      $('#<%=btnCancel.ClientID %>').click(function(){
        $('#<%=divAddress.ClientID %>').show();
        $('#<%=divEdit.ClientID %>').hide();
        return false;
      });
   });
    </script>
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="ContentMain" runat="Server">
<div id="divAddress" runat="server" style="border-style: none; padding-left: 10px">
                <table border="0" width="100%" cellpadding="0" cellspacing="0">

                    <tr>
                        <td align="left">
                            <asp:Button ID="btnEdit" runat="server" Text="Edit" CssClass="btn_bgimg" OnClick="btnEdit_Click" />
                        </td>
                    </tr>
                    <tr>
                        <td style="width: 20%" align="left" class="gen-td">
                            <asp:Panel ID="panel1" runat="server" Width="70%" CssClass="panelstyle">
                                <table width="100%">
                                    <tr>
                                        <td>
                                            <asp:Label ID="lblName" runat="server" Text="" />
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            <asp:Label ID="lblAddress1" runat="server" Text="" />
                                        </td>
                                    </tr>

                                </table>
                            </asp:Panel>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            &nbsp;
                        </td>
                    </tr>
                </table>
            </div>

           <div id="divEdit" runat="server" class="divstyle" style="display:none">
                <table border="0" width="100%" cellpadding="0" cellspacing="0">

                    <tr>
                        <td style="width: 20%" align="left" class="gen-td">
                            Name :
                        </td>
                        <td align="left" class="gen-td">
                            <asp:TextBox ID="txtName" Width="200px" CssClass="text_bgimg" runat="server" BorderStyle="Groove"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td align="left" class="gen-td">
                            Address :
                        </td>
                        <td align="left" class="gen-td">
                            <asp:TextBox ID="txtAddress1" Width="200px" CssClass="text_bgimg" runat="server"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td colspan="2" align="center" class="gen-td">
                            <asp:Button ID="btnSave" CssClass="btn_bgimg" runat="server" Text="Save" />
                            &nbsp; &nbsp;
                            <asp:Button ID="btnCancel" CssClass="btn_bgimg" runat="server" Text="Cancel"

                                onclick="btnCancel_Click" />
                        </td>
                    </tr>
                </table>
            </div>

aspx.cs

-------

aspx.cs
-------

protected void btnEdit_Click(object sender, EventArgs e)
   {       
       txtName.Text = "abcdef";
       //here i want to retrieve some data from database.

   }

推荐答案

（ document ）。ready（ function （）{

(document).ready(function(){

（ ＃button1）。单击（ function （）{

（ ＃div1）。hide（）;

("#div1").hide();

这篇关于使用jquery使div可见性为false的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！