0

0

Jquery zTree 树控件异步加载操作_jquery

php中文网

php中文网

发布时间:2016-05-16 15:13:36

|

1579人浏览过

|

来源于php中文网

原创

ztree 是利用 jquery 的核心代码,实现一套能完成大部分常用功能的 tree 插件

  • 兼容 IE、FireFox、Chrome 等浏览器
  • 在一个页面内可同时生成多个 Tree 实例
  • 支持 JSON 数据
  • 支持一次性静态生成 和 Ajax 异步加载 两种方式
  • 支持多种事件响应及反馈
  • 支持 Tree 的节点移动、编辑、删除
  • 支持任意更换皮肤 / 个性化图标(依靠css)
  • 支持极其灵活的 checkbox 或 radio 选择功能
  • 简单的参数配置实现 灵活多变的功能

异步加载的意思就是: 当点击展开树节点时,才去请求后台action返回点击节点的子节点数据并加载。

这里面主要设计ztree的setting变量的async属性设置:

var setting = {
  async: {
   enable: true,
   url:InitServiceIpsData.action,
   autoParam:[id, name],
   dataFilter: filter  
  },
 

当点击展开树节点时,会请求url指定的action获取子节点数据,然后绑定到ztree上。

注意这里后台action返回的是JSON字符串,而ztree绑定新的节点数据只接收数组,所以需要在绑定前用filter函数进行数据清洗转换操作,将字符串转换为数组:

绘蛙AI修图
绘蛙AI修图

绘蛙平台AI修图工具,支持手脚修复、商品重绘、AI扩图、AI换色

下载
//过滤异步加载ztree时返回的数据 
 function filter(treeId, parentNode, childNodes) {
  if (!childNodes) 
   return null;  
  childNodes = eval((+childNodes+)); //必须转换为[{id:103,pId:1,name:'子节点3'}];这样的格式 
  return childNodes;
 }

这样点击展开ztree树节点时,就会请求action获取子节点数据并绑定了。 

下面是后台action的一个实现:

public String InitServiceIpsData()
 {
  HttpServletRequest request = ServletActionContext.getRequest();
  String id = request.getParameter(id);
  String name = request.getParameter(name);
  System.out.println(请求获取+name+的ip列表);
   
  List> list = new ArrayList>();   
  for(int i = 1; i <= 2; i++){ 
   HashMap hm = new HashMap();   
   hm.put(id, id + 0 + i);
   hm.put(pId, id);
   hm.put(name, name + _IP_ + i);
   hm.put(isParent, false);
   list.add(hm);
  } 
   
  JSONArray finalJson = JSONArray.fromObject(list);
  this.initServiceIpsData = finalJson.toString();
  return SUCCESS;
 }
 

以上就是Jquery zTree 树控件实现异步加载操作的详细步骤,希望对大家的学习有所帮助。

相关专题

更多
vlookup函数使用大全
vlookup函数使用大全

本专题整合了vlookup函数相关 教程,阅读专题下面的文章了解更多详细内容。

26

2025.12.30

金山文档相关教程
金山文档相关教程

本专题整合了金山文档相关教程,阅读专题下面的文章了解更多详细操作。

28

2025.12.30

PS反选快捷键
PS反选快捷键

本专题整合了ps反选快捷键介绍,阅读下面的文章找到答案。

25

2025.12.30

表格中一行两行的方法
表格中一行两行的方法

本专题整合了表格中一行两行的相关教程,阅读专题下面的文章了解更多详细内容。

3

2025.12.30

cpu温度过高解决方法大全
cpu温度过高解决方法大全

本专题整合了cpu温度过高相关教程,阅读专题下面的文章了解更多详细内容。

5

2025.12.30

ASCII码介绍
ASCII码介绍

本专题整合了ASCII码相关内容,阅读专题下面的文章了解更多详细内容。

31

2025.12.30

GPS是什么
GPS是什么

本专题整合了GPS相关内容,阅读专题下面的文章了解更多详细内容。

3

2025.12.30

wifi拒绝接入
wifi拒绝接入

本专题整合了wifi拒绝接入相关教程,阅读下面的文章了解更多详细方法。

9

2025.12.30

丰网速运介绍
丰网速运介绍

本专题整合了丰网速运查询入口以及相关内容,阅读专题下面的文章了解更多内容。

3

2025.12.30

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
jQuery 教程
jQuery 教程

共42课时 | 3.6万人学习

HTML+CSS基础与实战
HTML+CSS基础与实战

共132课时 | 9.3万人学习

tp6+adminlte搭建通用后台
tp6+adminlte搭建通用后台

共39课时 | 5.7万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号