ASP.NET面板忽略样式直到在浏览器中加载

Question

我正在开发一个应用程序，我希望在页面加载时动态地将文本框加载到面板中，具体取决于我需要多少文本框。

我使用javascript / jquery用div来做这个，但我决定转而将这个过程编码为C＃。如果这是一个坏主意，请告诉我。

问题在设计视图中，我有24个面板，有一类grid_1 （我使用的是960网格系统，有24列。我永远不需要更多超过24个面板所以我决定将面板硬编码到页面中。但是，与div不同，这些面板在浏览器中呈现之前会忽略样式。

以下是Visual Studio 2012中的内容：

这看起来非常糟糕，因为有24个这样的吸盘，它在网络浏览器中看起来完全不明显。

我的代码：

<div id="myid">
            <div class="container_24" id="myid">
                <asp:Panel class="grid_1 measurementTextBoxContainer" runat="server"></asp:Panel>
                <asp:Panel class="grid_1 measurementTextBoxContainer" runat="server"></asp:Panel>
                <asp:Panel class="grid_1 measurementTextBoxContainer" runat="server"></asp:Panel>
                <asp:Panel class="grid_1 measurementTextBoxContainer" runat="server"></asp:Panel>
                <asp:Panel class="grid_1 measurementTextBoxContainer" runat="server"></asp:Panel>
                <asp:Panel class="grid_1 measurementTextBoxContainer" runat="server"></asp:Panel>
                <asp:Panel class="grid_1 measurementTextBoxContainer" runat="server"></asp:Panel>
                <asp:Panel class="grid_1 measurementTextBoxContainer" runat="server"></asp:Panel>
                <asp:Panel class="grid_1 measurementTextBoxContainer" runat="server"></asp:Panel>
                <asp:Panel class="grid_1 measurementTextBoxContainer" runat="server"></asp:Panel>
                <asp:Panel class="grid_1 measurementTextBoxContainer" runat="server"></asp:Panel>
                <asp:Panel class="grid_1 measurementTextBoxContainer" runat="server"></asp:Panel>
                <asp:Panel class="grid_1 measurementTextBoxContainer" runat="server"></asp:Panel>
                <asp:Panel class="grid_1 measurementTextBoxContainer" runat="server"></asp:Panel>
                <asp:Panel class="grid_1 measurementTextBoxContainer" runat="server"></asp:Panel>
                <asp:Panel class="grid_1 measurementTextBoxContainer" runat="server"></asp:Panel>
                <asp:Panel class="grid_1 measurementTextBoxContainer" runat="server"></asp:Panel>
                <asp:Panel class="grid_1 measurementTextBoxContainer" runat="server"></asp:Panel>
                <asp:Panel class="grid_1 measurementTextBoxContainer" runat="server"></asp:Panel>
                <asp:Panel class="grid_1 measurementTextBoxContainer" runat="server"></asp:Panel>
                <asp:Panel class="grid_1 measurementTextBoxContainer" runat="server"></asp:Panel>
                <asp:Panel class="grid_1 measurementTextBoxContainer" runat="server"></asp:Panel>
                <asp:Panel class="grid_1 measurementTextBoxContainer" runat="server"></asp:Panel>
                <asp:Panel class="grid_1 measurementTextBoxContainer" runat="server"></asp:Panel>
            </div>
        </div>

我是否应该停止使用面板并切换回javascript并在客户端进行，或者我应该继续做我正在做的事情，因为有一个我不知道的明显修复，这是完美的编码练习吗？

-Thanks

Answer 1

使用服务器端CssClass服务器端属性而不是class属性。即而不是

<asp:Panel class="grid_1 measurementTextBoxContainer" runat="server"></asp:Panel>

使用

<asp:Panel CssClass="grid_1 measurementTextBoxContainer" runat="server"></asp:Panel>

这只是一种预感，但我认为在这种情况下class被视为通用HTML元素属性，它在整个页面呈现后处理，而CssClass是服务器端属性（ tho it仍然呈现为class属性）立即生效