您的位置：首页 > 其它

zTree_v3无限分类操作案例

2017-06-11 00:00 211 查看

<?php
/**
* Created by 小雨在线
* User: 飛天
* Date: 2017/6/11 0011
* Time: 10:33
*/

?>

<!DOCTYPE html>
<HTML>
<HEAD>
<TITLE> zTree_v3操作案例 </TITLE>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">

<link rel="stylesheet" href="../../css/zTreeStyle/zTreeStyle.css" type="text/css">

<script type="text/javascript" src="../../js/jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="../../js/jquery.ztree.core.js"></script>

<SCRIPT LANGUAGE="JavaScript">
function zTreeOnClick(event, treeId, treeNode) {
//alert(treeNode.tId + ", " + treeNode.name);
console.log(treeNode);
console.log(treeNode.pId);
console.log(treeNode.id);
console.log(treeNode.name);
//alert(treeId);
};

var setting = {
data: {
simpleData: {
enable: true
}
},
callback: {
onClick: zTreeOnClick
}
};

$(document).ready(function () {

//ajax提交数据，请求后台PHP处理返回出目录结构json数据
$.ajax({
url: "./test2.php",
type: "get",
async: false,
dataType: "json",
success: function (data) {

zNodes = data;    //将请求返回的数据存起来
//alert(zNodes);
},
error: function () {//请求失败处理函数
alert('请求失败');
}
});

var tree = $.fn.zTree.init($("#treeDemo"), setting, zNodes);
tree.expandALL(true);//默认展开
});

</SCRIPT>

</HEAD>
<BODY>
<div>
<ul id="treeDemo" class="ztree"></ul>
</div>

</BODY>
</HTML>

<?php
/**
* Created by 小雨在线
* User: 飛天
* Date: 2017/6/11 0011
* Time: 10:42
*/

define("HOST", "xxx");    //主机名
define("USER", "aa");        //账号
define("PASS", "bb");        //密码
define("DBNAME", "cc");    //数据库名

$conn = new mysqli(HOST, USER, PASS);
$conn->select_db(DBNAME);
$sql = "SELECT id,pid AS pId,catename AS name FROM wuxianfenlei_deepcate ORDER BY id DESC";
$result = $conn->query($sql);

$data1 = [];

while ($row = $result->fetch_assoc()) {
$data1[] = $row;
}

echo json_encode($data1);

前台操作事例：

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航