由于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. 移动web开发(一)——移动web开发必备知识

    参考: 移动终端开发必备知识.http://isux.tencent.com/mobile-development-essential-knowledge.html

  2. Android实例-调用GOOGLE的TTS实现文字转语音(XE7+小米2)(XE10.1+小米5)

    相关资料: 注意:在手机上必须选安装文字转语音引擎“google Text To Speech”地址:http://www.shouji56.com/soft/GoogleWenZiZhuanYuYi ...

  3. ASP.NET学习笔记(4)——上传图片

    说明(2017-10-8 23:03:43): 1. 后面的内容都是一些杂七杂八的,零零碎碎的,之前都直接略过了,不过其实还是挺重要的,这次重新学习要认认真真敲一遍. 2. 明天中午9号要回北京了,今 ...

  4. ARKit从入门到精通(7)-ARCamera介绍

    ARCamera是一个相机,它是连接虚拟场景与现实场景之间的枢纽.在ARKit中,它是捕捉现实图像的相机,在SceneKit中它又是3D虚拟世界中的相机.(一般第一人称3D游戏,主角其实就是一个3D相 ...

  5. Mac OS X下的移动光标和文字编辑快捷键

    移动光标快捷键 Control-F 光标前进一个字符,相当于右键(F = Forward) Control-B 光标后退一个字符,相当于左键(B = Backward) Control-P 上移一行, ...

  6. [note]Why I haven’t quit my corporate job (yet)

    Why I haven't quit my corporate job (yet)html, body {overflow-x: initial !important;}html { font-siz ...

  7. android App抓包工具的应用(转)

    安装好 fiddler ,手头有一部Android 手机,同时 还要有无线网,手机和 电脑在同一个无线网络.这些条件具备,我们就可以 开始下面的步骤了. 正题 :Fiddler 主菜单 Tools - ...

  8. 未能加载文件或程序集”xxxx”或它的某一个依赖项,试图加载格式不正确的程序。

    通常是因为应用程序编译的目标平台与引用的DLL类库目标平台不一致造成的,如应用程序目标编译为64位,而引用了32位的DLL. 在Visual Studio修改应用程序目标编译平台即可. 更多关于目标编 ...

  9. Go Revel - Validation(验证)

    Revel提供了内建函数用于验证参数.它提供了: 一个`Validation`上下文集合来管理验证错误信息(键与消息内容) 辅助函数用于检查数据并将错误信息放入上下文 一个模板函数用于从`Valida ...

  10. dlib实现人脸landmark点检测以及一些其他的应用

    首先从中这里下载下代码: https://github.com/ageitgey/face_recognition#face-recognition 然后安装所以必须的组件,我用的Python3.5 ...