jquery+ztree插件同步加载
来源:互联网 发布:淘宝二手苹果数据线 编辑:程序博客网 时间:2024/06/08 20:28
对于树的节点加载有两种方法,一是同步全部加载,二是异步分批加载。
那么我们什么时候该用同步全部加载,什么时候该用异步分批加载呢?。当我们要显示的树节点不是很多的时候,应首选同步全部加载。如果我们有很多的节点要加载,并且加载时间非常的慢,这时候我们要选择异步分批加载。如果这时还用同步全部加载的话,页面加载的速度会很慢,如果数据足够多会造成页面假死现象。凡事不能说的太死,也要根据自己的实际情况来判定到底用那种方法合适。
//普通方式
var setting = {
data: {
simpleData: {
enable: true
}
},
callback: {
onClick: onClick
}
};
//从action中传来的treeData,json串
var zNodes = <s:property value="treeData"/>;
//加载树
$(document).ready(function(){
$.fn.zTree.init($("#treeDemo"), setting, zNodes);
});
//当点击树节点时的事件
function onClick(event, treeId, treeNode, clickFlag) {
var ttmc = treeNode.ttmc;
var id = treeNode.id;
var pid = treeNode.pid;
if(treeNode.level==2){
//alert(treeNode.level+'=='+'a');
//document.getElementById("contentFra1").src = “";
//document.getElementById("contentFra2").src = ”“;
}else if(treeNode.level==0 || treeNode.level==1){
//alert(treeNode.level+'=='+'b');
//document.getElementById("contentFra1").src = ”";
//window.opener.document.getElementById("xxxxxx").value=treeNode.name;//把选择的树节点名称回写到父页面指定的位置
self.close();
}else{
//alert("1111");
}
}
//以下是ajax方式
1 var zTreeObj;
2 var zNodes;
3 var setting = {
4 check: {
5 enable: true,
6 chkStyle:"checkbox"
7 },
8 data: {
9 simpleData: {
10 enable: true
11 }
12 }
13 };
这是设置树的属性值,在上一篇文章已经结束,在这不多废话了,代码中zTreeObj是定义的一个树的全局变量。zNodes是保存树节点的json对象。
1 $(document).ready(function(){
2 $.ajax({
3 type: "Get",
4 url: 'GetTree',
5 dataType: "text",
6 global: false,
7 async: false,
8 success: function (strReult) {
9 zNodes=eval(strReult);
10 },
11 error: function () {
12 alert("Ajax请求数据失败!");
13 }
14 });
15 zTreeObj = $.fn.zTree.init($("#treeDemo"), setting, zNodes);
16 $("#submit").bind('click',getNodeValue);
17 });
上面不难看出我是用ajax同步的方法去后台获取数据的,其中 9行是把获取的数据转换成json对象在赋值给zNodes, 此时zNodes已经有数据了,第15 行是初始化树,传进三个参数,分别是 html对象,setting树属性,zNodes json数据。这行执行完树就在id为treeDemo的地方显示出来了。
其实树就是拿来用的吗,那么当被选中的节点如何才能传到后台给java程序用呢,我的办法是这样的看代码。
第16行按钮绑定一个click
1 function getNodeValue (){
2 var nodes = zTreeObj.getCheckedNodes();
3 var s = '';//选中节点ids
4 //遍历选中的节点,为s赋值
5 for(var i=0; i<nodes.length; i++){
6 var isParent = nodes[i].isParent;
7 if(isParent!=true){
8 if (s != '')s += ',';
9 s += nodes[i].id;
10 }
11 }
12 $("#content").val(s);
13 }
但你选中复选框是按下按钮,通过这个方法就可以获取到叶子节点的信息,id pid name 等信息 把想获取的信息放到id为content的容器里,在用from传到后台,这样就后台就可以用到前台传来的信息了。
- jquery+ztree插件同步加载
- zTree树形插件使用 同步加载
- jquery+ztree插件异步加载(二)
- ztree 同步加载例子
- ztree同步加载数据
- zTree -- jQuery 树插件
- zTree -- jQuery 树插件
- zTree -- jQuery 树插件
- zTree -- jQuery 树插件
- jquery插件--zTree
- zTree -- jQuery 树插件
- zTree-jQuery树插件
- jQuery-zTree插件使用
- Struts2+json+ztree 同步加载
- zTree树插件动态加载
- (推荐)zTree -- jQuery 树插件
- JQuery 有关于 ZTree 插件
- Jquery树插件zTree入门教程
- eclipse中配置tomcat 启动正常 访问报404
- 结构体对齐
- HDU4399:Query
- 使用AudioRecord和AudioTrack来录制和播放音频
- Cassandra-Cluster-Admin
- jquery+ztree插件同步加载
- 统计文章中词的词频
- hdu 2391 Filthy Rich
- 16:棋盘分割
- Spring环境搭建,IoC容器初体验
- PHP博大精深,入门容易,精通难,怎么才能真正学好PHP
- EhCache使用详细介绍
- makefile 多级目录
- 一组数中最长连续递增子序列个数