页面引入：
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<link rel="stylesheet" href="zTree_v3-master/css/zTreeStyle/zTreeStyle.css">
<script type="text/javascript" src="zTree_v3-master/js/jquery.ztree.all.min.js"></script>
</head>
<body>
<div id="left" style="width:15%; height: 560px;">
<ul id="content" class="ztree" style="width:100%; height: 560px;"></ul>
</div>
</body>
</html>
传入js
var url = '.php';//php数据库页
$(function(){
initZtree();//初始化树结构
});
function initZtree(){
var setting = {
data: {
simpleData: {
enable: true
}
},
callback:{
onClick:zTreeOnClick
}
};
$.ajax({
url:url,
data:{},
type:'post',
dataType:'json',
success:function(data){
var arr = eval(data);
var zNodes = [];
for(var i in arr){
zNodes.push({
id:arr[i][0],
name:arr[i][1],
pId:arr[i][2]
})
}
$.fn.zTree.init($("#content"), setting, zNodes);
}
});
}
function zTreeOnClick(event, treeId, treeNode) {
$.ajax({
url:url,
data:{type:'getUsers',id:treeNode.id},
type:'post',
dataType:'json',
});
};
php数据库操作
<?php
$db = new MySQLi('localhost','root','root','z_1031');
!mysqli_connect_error() or die('连接失败');
$db->query('set names utf8');
$type = "";
//sql语句操作表
$sql = "select id,name,pid from u_depart";
$res = $db->query($sql);
$arr = $res->fetch_all();
echo json_encode($arr);
ztree使用
猜你喜欢
转载自www.cnblogs.com/wjwap/p/10296687.html
今日推荐
周排行