需求：
由于项目中家谱图数据量超大，而一般加载方式是通过，页面加载时 zTree.init方法进行数据加载，将所有数据一次性加载到页面中。而在项目中家谱级别又非常广而深，成千上万级，因此一次加载，完全加载不出来。于是需要进行优化为动态加载（增量加载）的方式，以便数据加载，提高体验度。
解决断路：
这应该好办，只要找到父节点单击事件，然后进行数据加载，结点附加即可。时间紧，任务重，完全没给研究的时间。只能硬着上，随便搜索一个“zTree动态加载”，出是出来了，标题也对，可里面的代码根本没找到添加结点一说……一边是需求催，一边是没找到类似。无语……对啊，不是有官网，于是把所有api函数浏览一遍，终于发现一个叫addNodes的函数。喜！
控件代码
<div class="UserTree"> <ul id="treeDemo" class="ztree"></ul> </div>
脚本代码（实现结点展开、单击事件时进行动态加载）：
<script>
var zNodes;
var zTree;
$(function () {
$.ajax({
cache: true,
type: "get",
url: "/User/NextLeve",
async: false,
success: function (data) {
zNodes = data;
},
error: function (data) {
alert("error");
}
});
zTree = ZTreeCustom.init($("#treeDemo"), setting, zNodes);
zTree.expandAll(false);
})
var setting = {
view: {
nameIsHTML: true
},
data: {
simpleData: {
enable: true
},
keep: {
parent: true
}
},
open: false,
callback: {
onClick: nodeClick,
onExpand: function (event, treeId, treeNode) {
addSubNode(treeNode);
}
}
};
function showIconForTree(treeId, treeNode) {
return !treeNode.isParent;
};
function searchM() {
var username = $("#txtName").val()
}
function nodeClick(event, treeId, treeNode, clickFlag) {
addSubNode(treeNode);
}
function addSubNode(treeNode) {
if (!treeNode.isParent) return;
var s = treeNode.children;
if (s != undefined)
return;
$.ajax({
cache: true,
type: "get",
url: "/User/NextLeve",
data: { userId: treeNode.id },
async: true,
success: function (data) {
zTree.addNodes(treeNode, data);
},
error: function (data) {
alert("error");
}
});
}
</script>
其中后端请求：
其中数据来源为请求路径“/User/NextLeve"htmlcode">
public class UserNode
{
public long id { get; set; }
public long pId { get; set; }
public string name { get; set; }
public bool open { get; set; }
public bool isParent { get; set; }
public string icon { get; set; }
}
效果，则实现为单击父结点/展开父结点时动态加载子结点。
以上所述是小编给大家介绍的jQuery zTree树插件动态加载效果实例代码，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对网站的支持！
ztree树插件动态加载
免责声明：本站文章均来自网站采集或用户投稿，网站不提供任何软件下载或自行开发的软件！ 如有用户或公司发现本站内容信息存在侵权行为，请邮件告知！ 858582#qq.com
P70系列延期，华为新旗舰将在下月发布
3月20日消息，近期博主@数码闲聊站 透露，原定三月份发布的华为新旗舰P70系列延期发布，预计4月份上市。
而博主@定焦数码 爆料，华为的P70系列在定位上已经超过了Mate60，成为了重要的旗舰系列之一。它肩负着重返影像领域顶尖的使命。那么这次P70会带来哪些令人惊艳的创新呢？
根据目前爆料的消息来看，华为P70系列将推出三个版本，其中P70和P70 Pro采用了三角形的摄像头模组设计，而P70 Art则采用了与上一代P60 Art相似的不规则形状设计。这样的外观是否好看见仁见智，但辨识度绝对拉满。