Question

我必须开发que和rply的功能，因为我根据我的要求创建用户控件作为休闲，我已经在用户控件的依赖和提交按钮的文本框中添加div并保留div显示样式为none，我在回复链接上调用javascript来显示该div。

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="SuppReview.ascx.cs" Inherits="LaaFoodWebApp.SuppReview" %>

<div>
    <table style="width:100%;">
        <tr>
            <td rowspan="2" style="width: 15%; vertical-align: top;">
                <asp:Label ID="lblMsgType" runat="server"></asp:Label>
                <br />
                <asp:Label ID="lblMsgId" runat="server"></asp:Label>
            </td>
            <td style="width: 70%; vertical-align: top;">
                <asp:Label ID="lblMsgtBody" runat="server"></asp:Label>
            </td>
            <td style="width: 15%">
                <asp:Label ID="lblVDate" runat="server"></asp:Label>
                <br />
                By 
                <asp:Label ID="lblname" runat="server"></asp:Label>
            </td>
        </tr>
        <tr>
            <td>
                <a id="toggleReply" style="color: #15ADFF" href="#">Reply</a>
            </td>
            <td>
                <asp:Label ID="lblEmail" runat="server"></asp:Label>
                <br />
                <asp:Label ID="lblPhone" runat="server"></asp:Label>
            </td>
        </tr>
        <tr>
            <td>
                &nbsp;</td>
            <td>
            <panel id="pnlreply" >
               <div id="DivReply" style="display:none">
                <table style="width:100%;">
                    <tr>
                        <td style="width: 15%">
                           Replys</td>
                        <td>
                            <asp:TextBox ID="TextBox1" runat="server" Height="50px" TextMode="MultiLine" 
                                Width="100%"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            &nbsp;</td>
                        <td style="text-align: right">
                            <asp:Button ID="btnSubmit" runat="server" Text="Submit" 
                                onclick="btnSubmit_Click" />
                        </td>
                    </tr>
                    </table></div></panel>
            </td>
            <td>
                &nbsp;</td>
        </tr>
    </table>
</div>

但是当我根据回复计数多次添加这些用户控件时。

for (int i = 0; i< dt.Rows.Count; i++)
{
    SuppReview SR = (SuppReview)Page.LoadControl("SuppReview.ascx");
    SR.settxt(dt.Rows[i]);
    reviews.Controls.Add(SR);
}

页面上的

<%@ Page Title="" Language="C#" MasterPageFile="~/SupplierMasterNew.Master" AutoEventWireup="true" CodeBehind="Supp_Views.aspx.cs" Inherits="LaaFoodWebApp.Supp_Views" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
 <script type="text/javascript">
     $(function () {
         $('#toggleReply').click(function () {
             $('#DivReply').toggle('slow');
             return false;
         });
     });
      </script>     
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="CPHcontent" runat="server">
    <div style="width: 100%; height: 24px; background-color: #D2EEF2; padding-top: 10px;
                font-size: large; color: #000000; text-align: left;">
        &nbsp;&nbsp;&nbsp; View</div>

    <asp:Panel ID="reviews" runat="server">

    </asp:Panel>
</asp:Content>

点击回复链接int隐藏显示div（包含依赖和提交按钮的文本框）多次，但不适用于其他条目

Answer 1

如果您多次添加此控件，页面上会有多个重复的ID！

考虑将ID更改为类。

也让你控制中的外部div成为一个类！例如<div class="wrapper">

声明一个函数：

function toggleReply(sender) {
    $(sender).parent('.wrapper').children('.DivReply').toggle('slow');
}

你的链接：

<a class="toggleReply" style="color: #15ADFF" href="javascript:void(0);" onclick="toggleReply(this);">Reply</a>

如何隐藏使用javascript在usercontrol上显示div

1 个答案: