欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  web前端

如何用ul+li的嵌套实现多级菜单效果?_html/css_WEB-ITnose

程序员文章站 2024-04-05 00:00:36
...
我想要用ul+li实现多级动态菜单,可以灵活添加元素和删除元素。
预期的效果如下:(图中的线是我画的,帮助理解各元素关系的,实际页面中不需要。)


但是现实的效果惨不忍睹,添加元素功能实现了,但是排版是乱的,完全看不出来逻辑关系
截图如下:


代码如下:











  • 工程名称:


  • 项目名称:
    • 子项名称:


















谁能告诉我如何实现?谢谢了。


回复讨论(解决方案)

页面名称

[/code]


非常感谢,你的代码很简单呀,原来都不知道还可以这么写,不过我的代码中每一个新加入的input的id和name都是用来体现结构关系的,比如说,所有input的name都是上一级input的id,这样通过name就能找到下级的所有input,id也是,都是按“类型_层级_序号”这种关系命名的。
你的代码实现的效果跟我现在的差不多,多加入几个层级后,画面会看着很乱,逻辑关系就不清楚了,我想实现下图的效果,不知道有没有什么办法,如果你知道能说一下吗?我好像每个帖子只能回复3次,所以连话也不敢多说。
如图:

页面名称