写一个树控件并没有想象中的那么容易,今天又花了我一个1个多小时,主要为IT小鲜肉 Widgets Tree控件添加了 单选、多选、选择前和选择后两个回调函数、获取选中节点的功能。后面会继续努力完善这个树控件。

1.通过设置初始化时候的选项{select:true}开启单选,通过设置初始化时候的选项{select:{type:'multiple'}}开启多选

使用实例代码如下:

运行效果如下:

2.添加了onBeforeSelect回调函数,用来实现自定义选择,如果该函数返回false会中断默认的选择行为

使用实例代码如下:

运行效果如下:

其中‘宁波’这个节点不可选择

3.添加了onAfterSelect回调函数,监听选择结束事件,无论是选中一个节点还是去选中一个节点都会调用该函数

4.添加了通过tree.itxxr_tree('getSelected')调用获取选中的节点的功能

使用实例代码如下:

运行结果如下:

IT小鲜肉 Widgets Tree 单选、多选、相关回调函数、获取选中的节点功能的更多相关文章

  1. jQuery 实现复选框全选、反选及获取选中的值

    实现复选框全选,反选及获取选中的值: 代码如下: <!doctype html> <html lang="en"> <head> <met ...

  2. jqurey 遍历 div内的所有input单选复选按钮并判断是否选中及Attr(checked)无效的解决

    关于页面前面标签 <ul> @{ foreach (var item in vote) { if (!string.IsNullOrEmpty(item.Img)) { <li cl ...

  3. jquery实现全选、全不选、反选、获取选中的所有值总结

    HTML 我们的页面上有一个歌曲列表,列出多行歌曲名称,并匹配复选框供用户选择,并且在列表下方有一排操作按钮. <!doctype html> <html> <head& ...

  4. IT小鲜肉 widgets tree 三种格式数据源

    昨天完成了下面几个功能,其中最麻烦的就是做图.边学GIMP用法边做图 1.使用GIMP软件G了几个图标 2.支持一维数组数据源,并按照指定的属性对数据源中的数据进行自动分组 运行效果: 3.支持由pi ...

  5. Jquery 多选全选/取消 选项卡切换 获取选中的值

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  6. 一款多功能的移动端滚动选择器,支持单选到多选、支持多级级联、提供自定义回调函数、提供update函数二次渲染、重定位函数、兼容pc端拖拽等等..

    https://github.com/onlyhom/mobileSelect.js/blob/master/docs/README-CN.md mobileSelect.js 一款多功能的移动端滚动 ...

  7. vue_elementUI_ tree树形控件 获取选中的父节点ID

    el-tree 的 this.$refs.tree.getCheckedKeys() 只可以获取选中的id 无法获取选中的父节点ID想要获取选中父节点的id;需要如下操作1. 找到工程下的node_m ...

  8. ExtJS 刷新或者重载Tree后,默认选中刷新前最后一次选中的节点代码片段

    //tree对象 var tree = Main.getPageControler().treePanel; //获取选中的节点 var node = tree.getSelectionModel() ...

  9. 关于textjs的tree带复选框的树

    通过查阅一些资料和自己之前了解到的一些相关知识,有时项目中需要用到.话不多说,先看一下效果图: 我写的这人员选择的树,主要是改写了TreePanel,如下代码: ExtendTreePanel.js ...

随机推荐

  1. ReentrantLock锁的释放

    一:代码 reentrantLock.unlock(); 虽然只有一句,但是源码却比较多: public final boolean release(int arg) { if (tryRelease ...

  2. Swinject 源码框架(二):循环依赖的解决

    可能存在循环依赖,比如 Parent 强制有 Child, Child 弱持有 Parent. 具体实现如下.Parent 初始化时,必须传入 Child,而 Child 初始化不必传入 Parent ...

  3. Web端测试和移动端测试

    之前参加的项目有涉及Web端测试和移动端测试,简单的记录下他们之间的区别:   1.记录bug 在Web端可以通过系统自带的截图和QQ截图等方式来截取bug的图片,对于错误的地方可以用工具自带的标识来 ...

  4. Storm系列三: Storm消息可靠性保障

    Storm系列三: Storm消息可靠性保障 在上一篇 Storm系列二: Storm拓扑设计 中我们已经设计了一个稍微复杂一点的拓扑. 而本篇就是在上一篇的基础上再做出一定的调整. 在这里先大概提一 ...

  5. 归并排序的理解和实现(Java)

    归并排序介绍 归并排序(Merge Sort)就是利用归并的思想实现的排序方法.它的原理是假设初始序列含有fn个记录,则可以看成是n个有序的子序列,每个子序列的长度为1,然后两两归并,得到[n2\fr ...

  6. apache2.4脚本一键安装(linux环境)

    1.下载apache安装包和相关组件 下载地址:https://pan.baidu.com/s/1o85i6Jw 其中包括 apache安装包:httpd-2.4.29.tar.gz apache安装 ...

  7. 11、使用xamarin实现全屏播放rtmp之类的直播视频

    直播类的app大部分都是以rtmp hls播放为主.目前主流的app解决方案大部分是引入ijkplayer 这个是基于ffmpeg中的ffplayer实现的. 众所周知ffmpeg的解码能力是一流的. ...

  8. 【转】Spark:一个高效的分布式计算系统

    原文地址:http://tech.uc.cn/?p=2116 概述 什么是Spark Spark是UC Berkeley AMP lab所开源的类Hadoop MapReduce的通用的并行计算框架, ...

  9. redis实战笔记(2)-第2章 使用 Redis构建Web应用

    第2章 使用 Redis构建Web应用 本章主要内容   1.登录cookie 2.购物车cookie 3.缓存生成的网页 4.缓存数据库行 5.分析网页访问记录   本章的所有内容都是围绕着发现并解 ...

  10. Java运用第三方开源jar包sigar.jar获取服务器信息

    通过使用第三方开源jar包sigar.jar我们可以获得本地的信息 一.准备工作 (1)下载jar包和相关文件 资源链接:百度云:链接:https://pan.baidu.com/s/1nxccJHJ ...