Question

我正在尝试从后面的代码动态添加项目到无序列表，而不确定如何正确地执行此操作。

html：

<ul class="nav navbar-nav" id="myUL" runat="server">
   <li><a runat="server" href="~/">Home</a></li>
   <li><a runat="server" href="~/About">About</a></li>
   <li><a runat="server" href="~/Contact">Contact</a></li>
</ul>

代码背后：

System.Web.UI.HtmlControls.HtmlGenericControl li = Master.FindControl("myUL") as System.Web.UI.HtmlControls.HtmlGenericControl;
System.Web.UI.HtmlControls.HtmlGenericControl anchor = new System.Web.UI.HtmlControls.HtmlGenericControl("a");
anchor.Attributes.Add("href", "~/Manager");
anchor.InnerText = "Manager";
li.Controls.Add(anchor);

这确实有效，但CSS全部乱了，不使用myUL控件的CSS。

如何解决这个问题？

Answer 1

我对您的代码进行了以下更改，所有列表项都正确显示：

System.Web.UI.HtmlControls.HtmlGenericControl li = new System.Web.UI.HtmlControls.HtmlGenericControl("li");
System.Web.UI.HtmlControls.HtmlGenericControl anchor = new System.Web.UI.HtmlControls.HtmlGenericControl("a");
anchor.Attributes.Add("href", "~/Manager");
anchor.InnerText = "Manager";
li.Controls.Add(anchor);
myUL.Controls.Add(li);

这会将HTML标记呈现为：

<ul class="nav navbar-nav" id="plcMain_myUL">
   <li><a id="plcMain_A1" href="/">Home</a></li>
   <li><a id="plcMain_A2" href="../../About">About</a></li>
   <li><a id="plcMain_A3" href="../../Contact">Contact</a></li>
   <li><a href="/Manager">Manager</a></li>
</ul>

当我使用您提供的代码时，生成了以下HTML：

<ul class="nav navbar-nav" id="plcMain_myUL">
   <li><a id="plcMain_A1" href="../../">Home</a></li>
   <li><a id="plcMain_A2" href="../../About">About</a></li>
   <li><a id="plcMain_A3" href="../../Contact">Contact</a></li>
   <a href="/Manager">Manager</a> <!-- Dynamically added item not wrapped around "li" -->
</ul>

我不太明白你的意思是＆＃34; CSS全部搞砸了＃34;。我能想到CSS无法正常工作的唯一原因是：

1）失踪的＆＃34; li＆＃34;当动态创建新的HTML锚点时。

2）您正在使用无序列表的ID属性进行样式设置。如果是这种情况，这将无法工作，因为.NET会在所有服务器控件上动态更改ID。相反，请使用class属性。

从后面的代码修改无序列表

1 个答案: