使用asp:MenuItem的DropDownList菜单

时间:2011-10-20 12:17:54

标签: c# asp.net drop-down-menu webforms

我正在尝试使用以下代码制作DropDownList菜单:

<asp:Menu ID="NavigationMenu" runat="server" CssClass="menu" EnableViewState="false" IncludeStyleBlock="false" Orientation="Horizontal">
    <Items>
        <asp:MenuItem NavigateUrl="~/Default.aspx" Text="דף הבית"/>
        <asp:MenuItem NavigateUrl="~/About.aspx" Text="עלינו"/>
    </Items>
</asp:Menu>

有没有人知道如何在“דףהבית”的子菜单上制作物品?

我找到了答案:

<Items>
    <asp:MenuItem NavigateUrl="~/Default.aspx" Text="דף בית">
    <asp:MenuItem NavigateUrl="#" Text="סך הבית 2"></asp:MenuItem>
    <asp:MenuItem NavigateUrl ="#" Text = "סך הבית 3"></asp:MenuItem>
    </asp:MenuItem>

    <asp:MenuItem NavigateUrl="~/About.aspx" Text="הרעיון הכללי"/>
    <asp:MenuItem NavigateUrl="~/programs.aspx" Text="התוכנות והתוספים של האתר" />
    <asp:MenuItem NavigateUrl="~/crew.aspx" Text="צוות?" />
</Items>

2 个答案:

答案 0 :(得分:4)

您可以让MenuItem控件不能自动关闭,并将子菜单(下拉菜单)嵌入其中。像这样:

<asp:Menu ID="NavigationMenu" runat="server" CssClass="menu" EnableViewState="false" IncludeStyleBlock="false" Orientation="Horizontal"> 
    <Items> 
        <asp:MenuItem NavigateUrl="~/Default.aspx" Text="דף הבית">
             <asp:MenuItem NavigateUrl="~/Page1.aspx" Text="Page1">
             <asp:MenuItem NavigateUrl="~/Page2.aspx" Text="Page2">
        </asp:MenuItem>
        <asp:MenuItem NavigateUrl="~/About.aspx" Text="עלינו"/> 
    </Items> 
</asp:Menu>

在上面的示例中,“Page1”和“Page2”将从“דףהבית”下拉。有一些很好的例子/解释here on MSDN

公平警告,这些控件可能有点难以设计。因此,如果您想要更多的灵活性/控制,我建议您使用CSS(以及需要时的javascript)使用HTML无序列表(ul

制作菜单

答案 1 :(得分:2)

试试这个:

<asp:Menu ID="NavigationMenu" runat="server" CssClass="menu" EnableViewState="false" IncludeStyleBlock="false" Orientation="Horizontal"> 
<Items> 
    <asp:MenuItem NavigateUrl="~/Default.aspx" Text="דף הבית">
         <asp:MenuItem NavigateUrl="~/Page1.aspx" Text="Page1"/>
         <asp:MenuItem NavigateUrl="~/Page2.aspx" Text="Page2"/>
    </asp:MenuItem>
    <asp:MenuItem NavigateUrl="~/About.aspx" Text="עלינו"/> 
</Items> 

在第4行&amp;中的另一个解决方案“/”中5失踪....