Question

当我点击下拉菜单时，它应显示其项目但不显示。我不知道为什么会这样。请告诉我应该在哪里进行改进以改进它

ul + li下拉菜单未显示其项目

<div class="dropdown">
        <button class="btn dropdown-toggle" type="button" data-toggle="dropdown">
            Dropdown <span class="caret"></span>
        </button>
        <ul class="dropdown-menu" role="menu">
            <li role="presentation"><a href="#" role="menuitem" tabindex="-1">List Item 1</a></li>
            <li role="presentation"><a href="#" role="menuitem" tabindex="-1">List Item 1</a></li>
            <li role="presentation"><a href="#" role="menuitem" tabindex="-1">List Item 1</a></li>
            <li role="presentation"><a href="#" role="menuitem" tabindex="-1">List Item 1</a></li>
        </ul>
    </div>

下面给出的下拉菜单显示了它的项目，然后我如何使用select和option标签创建Mega-downdown菜单。请指导我

<div class="dropdown" data-toggle="dropdown">
        <select name="colour" class="form-control">
            <option>Please Select</option>
            <option>red</option>
            <option>orange</option>
            <option>blue</option>
        </select>
    </div>

Answer 1

列表基本上只用于列出元素。

为了使您的下拉列表正常工作，您可以使用选择和选项 HTML标记，而不是 ul 和 li

Answer 2

您可以将optgroup标记用于多级下拉列表。它易于实施，你可以得到很多文章来帮助你。

Answer 3

任何人都可以修改它以创建超级下拉菜单，请向其添加更多信息。您的合作将不胜感激： - ）

<div class="dropdown" data-toggle="dropdown">
        <select name="Items" class="form-control">
            <optgroup label="Group 1">
                <option>Item 1</option>
                <option>Item 2</option>
                <option>Item 3</option>
                <option>Item 4</option>
            </optgroup>
            <optgroup label="Group 2">
                <option>Item 1</option>
                <option>Item 2</option>
                <option>Item 3</option>
                <option>Item 4</option>
            </optgroup>
            <option>Clothes</option>
            <option>Foods</option>
        </select>
    </div>

下拉菜单未显示其在ASP.NET MVC5中单击的项目查看

3 个答案: