由于jquery ui没有集成tree控件,所以在网上找到了zTree v3。zTree无疑是功能非常强大的一款jquery的插件,而且是国人作品,zTree的文档写得也非常好,效果很炫。但是我在使用过程中,发现ztree目前的版本,缺乏一个onSelect的callback。系统的要求是这样的,Tree的数据load完成,render之后,自动选择一个节点,并根据该节点从server装载新的数据并显示。于是决定自己添加一下此功能。

经分析发现zTree的实例是在调用jQuery.fn.zTree.init的时候动态构建的,所以不存在一个静态的类来扩展,所以只有在构建zTree实例的时候截取实例变量并进行扩展,废话少说上代码:

function enZTree(){
if(!$.fn.zTree._ori_init){
$.fn.zTree._ori_init=$.fn.zTree.init;
$.fn.zTree.init=function(){
obj=$.fn.zTree._ori_init.apply(this,arguments);
return function(t){
t._ori_selectNode=t.selectNode;
t.selectNode=function(nd){
t._ori_selectNode.apply(this,arguments);
if (this.setting.callback.onSelect){
this.setting.callback.onSelect(null,this.setting.treeId,nd);
}
};
return t;
}(obj);
}
}
}

代码通过替换jQuery.fn.zTree.init函数实现对用户构建的zTree实例的动态扩展。onSelect的配置参照api文档中其他callback的设置即可。

如果需要自动扩展,则需要注册一个启动方法:

jQuery(document).ready(function(){
enZTree();
});

给zTree添加onSelect callback的更多相关文章

  1. ant design pro 实战 : 使用 ztree

    应当指出,antd 是有 ztree 组件的,但是太简单,无法满足复杂的业务需求. 所以我还是决定使用zTree. 用 npm | cnpm 或者 yarn | tyarn 安装,这一步略. 在 js ...

  2. 带callback的future实现

    jdk暂时不支持,所以只有自己实现带callback的future. 完成后callback的 final TaskPromise promise = new DefaultTaskPromise() ...

  3. 使用 vite 构建一个表情选择插件

    初始化 Vite 基于原生 ES 模块提供了丰富的内建功能,开箱即用.同时,插件足够简单,它不需要任何运行时依赖,只需要安装 vite (用于开发与构建)和 sass (用于开发环境编译 .scss ...

  4. 前端之ajax

    前端之ajax 本节内容 ajax介绍 原生js实现ajax jquery实现ajax json 跨域请求 1. ajax介绍 AJAX(Asynchronous Javascript And XML ...

  5. javascript的ajax

    AJAX 一 AJAX预备知识:json进阶 1.1 什么是JSON? JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式.JSON是用字符串来表示Javas ...

  6. 【JavaScript】--重点解析之跨域请求

    JSON JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式. JSON是用字符串来表示Javascript对象,例如可以在django中发送一个JSON格式 ...

  7. JS、JQuery和ExtJs的跨域处理

    1.什么是跨域?跨域,JavaScript出于安全方面的考虑,不允许跨域调用其他页面的对象.简单地理解就是因为JavaScript同源策略的限制,a.com 域名下的js无法操作b.com或是c.a. ...

  8. Jsonp跨域访问

    很早之前看过好几篇跨域访问的文章,然后做项目的时候基本没有遇到跨域访问的问题.不过该来的还是会来,前些天终于让我遇到了.于是重温了一下原理这些,再进行实战.于是现在也敢通过实战后的一些理解来和大家分享 ...

  9. 深入浅出JSONP--解决ajax跨域问题

    取不到数据! 上周客户新买了服务器,原本在旧的服务器上放着客户的Web主页信息和一个后台程序(asp.net),在客户的主页中有一个动态显示最新消息的处理,这个处理就是通过ajax异步从那个后台程序中 ...

随机推荐

  1. model number

    // test.cpp : Defines the entry point for the console application. // #include "stdafx.h" ...

  2. Android仿华为天气绘制刻度盘

    效果图 能够看到这个自己定义控件结合了颜色渐变.动态绘制刻度.动态水球效果.接下来我们就来看看这个效果是怎样一步一步实现的. 開始自己定义控件 和非常多自己定义控件方式一样须要去基础某种View或者某 ...

  3. 【Unity Shader】六、使用法线贴图(Normal Map)的Shader

    学习资料: http://www.sikiedu.com/course/37/task/456/show# http://www.sikiedu.com/course/37/task/458/show ...

  4. (转载)WPF中的动画——(一)基本概念

    http://www.cnblogs.com/TianFang/p/4050845.html WPF的一个特点就是支持动画,我们可以非常容易的实现漂亮大方的界面.首先,我们来复习一下动画的基本概念.计 ...

  5. UnicodeEncodeError: 'ascii' codec can't encode characters in position 0-1: ordinal not in range(128)

    在使用selenium处理中文网页或者网页标题是中文的时候,出现UnicodeEncodeError: 'ascii' codec can't encode characters in positio ...

  6. Linxu安装Tomcat与Jdk并卸载自带OpenJdk

    下载安装tomcat 1.下载apache-tomcat-7.0.47.tar.gz tomcat压缩包上传到linxu服务器 2.cd到文件存放目录使用(tar -xvzf apache-tomca ...

  7. c# 反射取其他项目的资源文件

    反射获取其他项目里面的资源文件. dll或exe里面 try { System.Reflection.Assembly dll = System.Reflection.Assembly.LoadFil ...

  8. spring+dubbo整合

    创建公共接口或者project用到的一些bean.我这里就仅仅是创建了一个接口.project文件夹例如以下: watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQ ...

  9. android开发(43) 动画演示,会跑的小人,从屏幕左侧跑到右侧

    想做一个动画,一个会跑的小人,从屏幕右侧跑道右侧,于是做了个尝试,上图: 要完成这样需要三步: 1. 做一个 帧动画 (frame animation),由多张图片组成,组成小人连续跑动的样子. 2. ...

  10. mysql 慢查询时间

    只有当一个query执行时间(不包括锁等待的时间)>long_query_time的时候,才会判定会slow log: 但是判定为slow log之后,输出包括Query_time(执行时间+锁 ...