AdminLte3改造为：单iframe，多级动态json菜单

最新推荐文章于 2023-12-27 23:34:06 发布

Edward_555

最新推荐文章于 2023-12-27 23:34:06 发布

阅读量2.8k

点赞数 1

分类专栏： html Web 文章标签： bootstrap html jquery

本文链接：https://blog.youkuaiyun.com/qq_24915489/article/details/111100587

版权

一、下载代码

https://gitee.com/zhou-kang/admin-lte3-i-frame-json_menus

二、运行index.html

三、核心文件menu.js

menu.js中定义了json格式的菜单，并将json转为adminLte的菜单html，可根据需要改在为动态菜单。

pages/test/leaf*.html，是iframe的测试页面，其它文件均是AdminLte3 的原始文件。

核心为menu.js文件，必须在jquery引入后使用
iframe的id为：iframeMain
菜单ul的id为menutree

//菜单框架
<div class="sidebar">
  <!-- 侧边栏菜单 -->
  <nav class="mt-2">
   <ul id="menutree"  class="nav nav-pills nav-sidebar flex-column" data-widget="treeview" role="menu" data-accordion="false">
   </ul>
  </nav>
  <!-- /.sidebar-menu -->
</div>


//iframe框架
  <div  class=