用户,角色,功能
Posted sss1995
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了用户,角色,功能相关的知识,希望对你有一定的参考价值。
登录页面js
function login(){ //获取账号密码输入框的值 var uid = $(‘#uid‘).val(); var pwd = $(‘#pwd‘).val(); //传入后台 $.ajax({ type:"post", url:"chuli.php", async:true, data:{ type:‘login‘, uid:uid, pwd:pwd }, dataType:‘text‘, success:function(data){ //当后台执行成功时跳转主页,否则弹窗密码错误 if(data == ‘ok‘){ window.location.href = "renyuan.html"; }else{ alert(‘密码错误‘); } } }); }
主页html
//放入用户uid的地方 <input id="uid" type="hidden" value=""> <button onclick="exit()">退出登录</button> //人员下拉 <select id="renyuan" onchange="changeOcc()"></select> //角色多选框 <div id="juese"></div> <button onclick="save()">保存</button> //功能位置 <div id="gongneng"></div>
主页js
$(function(){ initUid();//放入隐藏input 用户的uid ajaxEvent();//加载用户下拉和角色多选框 userToOcc();//用户对应角色选中 gongneng();//功能显示 }) //放入隐藏input 用户的uid,异步进行 function initUid(){ $.ajax({ type:"post", url:"chuli.php", async:false, data:{type:‘initUid‘}, dataType:‘text‘, success:function(data){ //若session为空则跳转登录页面 if(data == ""){ window.location.href = "login.html"; }else{ //session有值则放入隐藏input $(‘#uid‘).val(data); } } }); } //退出登录,清空session并跳转登录页面 function exit(){ $.ajax({ type:"post", url:"chuli.php", async:true, data:{type:‘exit‘}, dataType:‘text‘, success:function(data){ if(data == ‘ok‘){ window.location.href = "login.html"; } } }); } //加载用户下拉和角色多选框 function ajaxEvent(){ //拿到数组(用户名,角色) $.ajax({ type:"post", url:"chuli.php", async:false, data:{type:‘userAocc‘}, dataType:‘json‘, success:function(data){ //console.log(data[0]); chuliData(data[0],data[1]); } }); } //处理用户名和角色 function chuliData(userArr,occArr){ var strU=""; var strO=""; //循环添加下拉用户,value为用户id,内容为用户姓名 for(var i = 0; i < userArr.length; i++){ strU += "<option value=‘"+userArr[i][0]+"‘>"+userArr[i][1]+"</option>" } // 打印到页面 $(‘#renyuan‘).html(strU); //循环添加多选框,value为角色id,内容为角色名 for(var j = 0; j < occArr.length; j++){ strO += "<label><input type=‘checkbox‘ value=‘"+occArr[j][0]+"‘ />"+occArr[j][1]+"</label>"; } //打印到页面 $(‘#juese‘).html(strO); } //用户对应角色选中 function userToOcc(){ //获取下拉菜单选中的用户的id var uid = $(‘#renyuan‘).val(); //拿到此用户的角色数组 $.ajax({ type:"post", url:"chuli.php", async:true, data:{type:‘userToOcc‘,uid:uid}, dataType:‘json‘, success:function(data){ //console.log(data); chuliOcc(data); } }); } //处理角色数组 function chuliOcc(data){ //所有多选框 var dxk = $(‘#juese‘).find("input[type=‘checkbox‘]"); //清空选中状态 dxk.prop(‘checked‘,false); //循环用户角色 for(var i = 0; i < data.length; i++){ //遍历多选框,若多选框的id和用户角色id相同则选中 dxk.each(function(){ if($(this).val() == data[i][0]){ $(this).prop(‘checked‘,true); } }) } } //当下拉改变时执行户对应角色选中函数 function changeOcc(){ userToOcc(); } //保存 function save(){ var uid = $(‘#renyuan‘).val(); var dxk = $(‘#juese‘).find("input[type=‘checkbox‘]"); var occArr = []; dxk.each(function(){ if($(this).prop(‘checked‘) == true){ occArr.push($(this).val()); } }) $.ajax({ type:"post", url:"chuli.php", async:true, data:{type:‘save‘,uid:uid,occArr:occArr}, dataType:‘text‘, success:function(data){ //console.log(data); if(data == ‘ok‘){ alert(‘更改成功‘); userToOcc(); } } }); } function gongneng(){ var uid = $(‘#uid‘).val();console.log(uid); var str =""; $.ajax({ type:‘post‘, url:‘chuli.php‘, data:{ type:‘gongneng‘, uid:uid }, dataType:‘json‘, success:function(data){ //console.log(data); for(var i = 0; i < data.length; i++){ str += "<div>"+data[i][0]+"</div>" } $(‘#gongneng‘).html(str); } }) }
以上是关于用户,角色,功能的主要内容,如果未能解决你的问题,请参考以下文章