使用layui+ajax实现简单的菜单权限管理及排序的方法-创新互联

**简单的例子使用的layui框架，并没有使用他的ztree插件，只用ajax配合sql完成最简单的一二级菜单权限控制及其排序功能。

公司主营业务：做网站、网站设计、移动网站开发等业务。帮助企业客户真正实现互联网宣传，提高企业的竞争能力。创新互联公司是一支青春激扬、勤奋敬业、活力青春激扬、勤奋敬业、活力澎湃、和谐高效的团队。公司秉承以“开放、自由、严谨、自律”为核心的企业文化，感谢他们对我们的高要求，感谢他们从不同领域给我们带来的挑战，让我们激情的团队有机会用头脑与智慧不断的给客户带来惊喜。创新互联公司推出汇川免费做网站回馈大家。

先看数据库设计：**

user表：

role表：

menu表：

user_role表：

role_menu表：

在这里 menu的id依然是主键，多了mid也就是菜单id，pare_menu_id也就是这个菜单对应的父级菜单的菜单id（mid）；没有的话，就是0，也就是一级菜单，在这里，一级菜单的mid必须满足为整千数，或者万也行，其子菜单在mid+999范围内；

sql查询结果：

前台数据处理方法：

//菜单循环遍历打印拼接操作
  $(function () {
  $.ajax( {
   url : projectName+'/sys/menu/findMenuByRole',
   type : 'post',
   dataType : 'json',
   success : function(data) {
   var menu = ""; //定义变量存储
   for(var i = 0;i"
    for(var j = 0;j data[i].mid && data[j].mid < (data[i].mid)+1000){ //取出这个父元素所对应的子元素
     menu += "
"
     menu += "
"
     menu +=  ""+'     '+data[j].menuName+""
     menu += "
"
     menu += "
"
     }
    }
    }
    menu += "";
   }
   $("#nav").html(menu);
   var element = layui.element;
   element.init()//初始化element事件，使菜单展开
   }
  });
  })

本文名称：使用layui+ajax实现简单的菜单权限管理及排序的方法-创新互联
本文地址：http://shouzuofang.com/article/diepjp.html