Question

我尝试创建这样的选择（它是下拉选择输入）：

enter image description here

正如您所看到的那样，当选择打开时，它会显示主要类别，通过单击每个类别将显示子类别。您也可以单击勾选以选择当前类别和子类别。此外，当显示类别的子类别时，顶部有两个项目。一个是刻度线，另一个是后面的，通过点击它，你可以再次看到主要的类别。

如何创建这样的选择？

提前致谢

Answer 1

这是可以用来创建菜单和子菜单的html部分。

<body class="no-js">
    <nav id="topNav">
            <ul>
                <li><a href="#" title="Nav Link 1">Nav Link 1</a></li>
            <li>
                <a href="#" title="Nav Link 1">Nav Link 2</a>
                <ul>  
                    <li><a href="#" title="Sub Nav Link 1">Sub Nav Link 1</a></li>
                    <li><a href="#" title="Sub Nav Link 2">Sub Nav Link 2</a></li>
                    <li><a href="#" title="Sub Nav Link 3">Sub Nav Link 3</a></li>
                    <li><a href="#" title="Sub Nav Link 4">Sub Nav Link 4</a></li>
                    <li class="last"><a href="#" title="Sub Nav Link 5">Sub Nav Link 5</a></li>
                </ul>                
            </li>
            <li><a href="#" title="Nav Link 1">Nav Link 3</a></li>
            <li><a href="#" title="Nav Link 1">Nav Link 4</a></li>
            <li><a href="#" title="Nav Link 1">Nav Link 5</a></li>
        </ul>
    </nav>
</body>

在一个下拉选择中显示类别和子类别

1 个答案: