公司或網站的正常運行，離不開管理員對各個員工的合理分配，那先看看權限管理中的角色管理好了：

要更改用戶的角色，那麽先來理一下思路：

（1）用戶現在是什麽角色？

（2）用戶將要成為什麽角色？

（3）怎樣更改用戶的角色？

首先會用到的三張表：user表，userinjs表，juese表

第一步：遍歷輸出所有的用戶

             <h2>更改用戶角色</h2>
		<!--將所有員工遍歷出來-->
		<p>員工列表：</p>
		<select id="user">   <!--此處用id,和value進行傳值-->
			<?php
				require "../DB.class.php";
				$db = new DB();
				$sql = "select * from users";
				$arr = $db->query($sql);
				foreach($arr as $v)
				{
					echo "<option value= ‘{$v[0]}‘>{$v[2]}</optiop>";
				}				
			?>			
		</select><br />
 

　　這樣可以實現如下效果：

第二步：將所有權限遍歷輸出

             <!--從數據庫讀取角色-->
		<p>員工角色：</p>
		<?php
			$sql2 = "select * from juese ";
			$arr2 = $db->query($sql2);
			foreach($arr2 as $n)
			{
				echo "<input type=‘checkbox‘ class=‘ck‘ value=‘{$n[0]}‘/>{$n[1]}";
			}			
			?>	<br />
 

　效果圖如下：

第三步：當點擊某用戶時，顯示他現在的角色

（1）

$("#user").change(function(){	
var uid = $("#user").val();
	$.ajax({
		url:"chuli.php",
		data:{uid:uid},
		type:"POST",
		dataType:"TEXT",
		success:function(data){
//			alert(data);
			//用strquery類返回的，所以此處先拆分字符串
			var jsid = data.trim().split("|");
//			alert(jsid);			
			//取所有的復選框(屬於jQuery對象)
			var ck = $(".ck"); 			
			//清一下復選框的狀態，jquery 支持這樣全部清除；如果不清除狀態，上次選中的會影響此次結果
			  ck.prop("checked",false);
             for(var i=0;i<ck.length;i++)
             {  
             	//.eq()取到的是dom對象
             	var v= ck.eq(i).val();  
             	//判斷v是否在返回的jsid中
//           	alert(jsid.indexOf(v)>=0);
             	
             	if(jsid.indexOf(v)>=0)
             	{   
             		//如果存在，則選中
             		ck.eq(i).prop("checked",true);
             	}            	
             }
		}
	})	
}）		
 

　這樣，點擊李四，顯示李四的角色；點擊王五，顯示王五的角色

但是 ，這樣會有bug，當刷新頁面時，會如下圖一樣，沒有默認值，那該怎麽辦呢？----封裝函數，在刷新的時候調用一下

（2）封裝後

<script type="text/javascript">
	sel();//頁面刷新調用
$("#user").change(function(){	
 	sel();//下拉選框變化調用
})

//封裝函數
function sel(){
	var uid = $("#user").val();
	$.ajax({
		url:"chuli.php",
		data:{uid:uid},
		type:"POST",
		dataType:"TEXT",
		success:function(data){
			var jsid = data.trim().split("|");
			var ck = $(".ck"); 			

			  ck.prop("checked",false);
             for(var i=0;i<ck.length;i++)
             {  
            
             	var v= ck.eq(i).val();  
             	
             	if(jsid.indexOf(v)>=0)
             	{   

             		ck.eq(i).prop("checked",true);
             	}            	
             }
		}
	})				
}

</script>

第四步：更改用戶角色，點擊“確認更改”完成更改

（1）添加“確認更改”按鈕

	<input type="button" value="確認更改" id="qr"/>

（2）代碼

//更改角色
$("#qr").click(function(){

	var uid = $("#user").val();

	//造一個空字符串，將選中的復選框拼成字符串，用逗號分隔
	var str = "";
	var ck = $(".ck");
	for(var i=0; i<ck.length;i++)
	{
		if (ck.eq(i).prop("checked"))
		{
			str = str+ck.eq(i).val()+",";
		}
	}
	
	//拼完的字符串會多一個逗號，用截取字符串的方法去逗號
	str = str.substr(0,str.length-1);	
	alert(str);
	$.ajax({
		url:"del-add.php",
		data:{uid:uid,jsid:str},
		type:"POST",
		dataType:"TEXT",
		success: function(data){
			alert("保存成功！");
		}
	});	
})

　　這樣就可以實現更改角色的功能了，那麽來看一下效果：

更改前的頁面和數據庫：

更改後頁面的數據庫：

最後：chuli.php頁面和del-add.php頁面

chuli.php

<?php
$uid =$_POST["uid"];
require "../DB.class.php";
$db = new DB();
$sql = "select jsid from userinjs where uid=‘{$uid}‘";
echo $db->strquery($sql);
?>

del-add.php:

<?php
$uid = $_POST["uid"];
$jsid = $_POST["jsid"];
require "../DB.class.php";
$db = new DB();
//清空原有角色
$sql = "delete from userinjs where uid=‘{$uid}‘";
$db->query($sql,0);
//添加選中的角色
$jsid = explode(",",$jsid);
foreach($jsid as $v)
{
	$sql = "insert into userinjs values(‘‘,‘{$uid}‘,‘{$v}‘)";
	$db->query($sql,0);
}
?>

簡單的角色管理就實現了~~~離第二階段項目又近了~~~

網站權限管理 之 角（jue）色管理