您的位置:首页 > Web前端 > JavaScript

一点用JS写控制权限的心得

2015-10-18 17:27 183 查看
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<style>
*{margin: 0;
padding:0}
li{list-style: none;
height: 50px;
background: red;}
.active {
background: yellow;
color: white;}
#ul li{
width: 19%;
float: left;
text-align: center;
vertical-align: middle;
margin: 0 2px;
cursor: pointer;
}

</style>
<body>
<div>
<ul id="ul">
<li title="">1</li>
<li title="">2</li>
<li title="">3</li>
<li title="">4</li>
<li title="">5</li>
</ul>
</div>

<script>
var attr={data:[
{'工号':'011','模块':'HHHYU-UUIU-1','权限':'N'},
{'工号':'011','模块':'HHHYU-UUIU-2','权限':'Y'},
{'工号':'011','模块':'HHHYU-UUIU-3','权限':'N'},
{'工号':'011','模块':'HHHYU-UUIU-4','权限':'N'},
{'工号':'011','模块':'HHHYU-UUIU-5','权限':'Y'}

]
}

//员工是后台通过处理了的,引用就会有模块和权限2项
var m = attr.data;
var oUl = document.getElementById('ul');
var aLi = oUl.getElementsByTagName('li');
if(m.length >0){    //判断数据非空
for(var j=0;j<aLi.length;j++){
aLi[j].index = j;
aLi[j].setAttribute("title",m[j]['模块'])    //创建模块title
aLi[j].onclick=function() {
aTitle = this.title;
if(m[this.index]["模块"] == aTitle)     //判断模块是否等于当前获取的模块
{
if(m[this.index]["权限"]=="Y"){     //判断权限
this.className = "active";
}else{
alert("您没有该权限!")
}
}else{
alert("您没有该权限!")
}
}
}
}else{
alert("您没有该权限!")
}

</script>
</body>
</html>

//其实里面还有些缺陷的:
第一:在创建title的时候,必须数据库取出来的数据有5个模块,不然中间少几个模块,相对应的顺序就会改变了
注:有高手能搞定的或者其中还有什么问题,请发到836337706@qq.com谢谢了。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: