1.修复理由

  在一个android项目中用到了treeview控件(本来自己通过android的原生api实现了一个http://www.cnblogs.com/Mr-Nobody/p/3527688.html,但是动画效果总是有点小问题,实在是击碎我那小小的自信心,于是果断转用webview+js插件实现了。)。本来js插件里优秀的tree控件很多,比如国内著名的ztree,还有各大ui控件的自带tree。不过要数最简单易用就要数最为经典的jquery.treeview了。而且动画效果也还行,我就是看中了其轻便,动画效果好,而且也比较容易用。。(其它的tree暂时还没有接触过。。)。,所以就采用了它的。

  2.修复过程

在jquery.treeview中增加子节点的方法是:

    var branch=$("<li><span>child1</span></li>").appendTo(parentLi);
$("#tree").treeview({
add:branch
});

但是此方法有个很严重的问题,就是增加的节点必须只能是li。如果是在一个没有子节点的节点中插入子节点时,该节点的展开按钮是没有的,也就是父级的事件没有绑定上去。。

于是乎照着这个思路写了几个hack的写法,都没有用,于是一狠心就上了源代码。。还好大神的代码不多,虽然以自己目前的水平看懂大神的代码还有几个地球到月球的距离,但是

好在大神代码不多,用ctrl+F也搜索到了。

略加猜测,便在这里加上了几行代码。。

居然人品爆发,一次成功了!

  3.补遗

  也许菜鸟的人品毕竟有限,在运气好的情况下对于增加节点的bug一次就修复了,但是在删除节点时,由于本人对jquery的事件机制一知半解,结果浪费了很多时间。。直到查看文档才恍然大悟。。

官网的demo都会有"全部删除"的bug,真是对开源项目太不认真了。。

原因是jquery的冒泡事件导致的。

return  proxied.apply(this, arguments).bind("add", function(event, branches) {
$(branches).prev()
.removeClass(CLASSES.last)
.removeClass(CLASSES.lastCollapsable)
.removeClass(CLASSES.lastExpandable)
.find(">.hitarea")
.removeClass(CLASSES.lastCollapsableHitarea)
.removeClass(CLASSES.lastExpandableHitarea);
$(branches).find("li").andSelf().prepareBranches(settings).applyClasses(settings, $(this).data("toggler"));
/*修复增加ul的bug*/
if(branches.is("ul")){
$(branches).parent().prepareBranches(settings).applyClasses(settings, $(this).data("toggler"));
}
return false;
}).bind("remove", function(event, branches) {
var prev = $(branches).prev();
var parent = $(branches).parent();
$(branches).remove();
prev.filter(":last-child").addClass(CLASSES.last)
.filter("." + CLASSES.expandable).replaceClass(CLASSES.last, CLASSES.lastExpandable).end()
.find(">.hitarea").replaceClass(CLASSES.expandableHitarea, CLASSES.lastExpandableHitarea).end()
.filter("." + CLASSES.collapsable).replaceClass(CLASSES.last, CLASSES.lastCollapsable).end()
.find(">.hitarea").replaceClass(CLASSES.collapsableHitarea, CLASSES.lastCollapsableHitarea);
/*修复全部删除的bug*/
if(parent.children().length==0){ parent.parent().removeClass(CLASSES.collapsable).removeClass(CLASSES.expandable)
parent.siblings(".hitarea").andSelf().remove();
} //返回false,终止冒泡,就不会把整棵树都删除了。。
return false;
//throw 1;
});

修复jquery.treeview的增加子节点的方法的bug的更多相关文章

  1. 微服务探索之路04篇k8s增加子节点,metrics资源监控,ingress-nginx域名配置及https配置

    1 k8s增加子节点 1.1 子节点服务器安装docker,使用脚本自动安装 curl -fsSL https://get.docker.com | bash -s docker --mirror A ...

  2. [转]Javascript removeChild()删除节点及删除子节点的方法(同样适用于jq)

    Javascript removeChild()删除节点及删除子节点的方法 这篇文章主要介绍了Javascript removeChild()删除节点及删除子节点的方法的相关资料,需要的朋友可以参考下 ...

  3. 【总文档】rac增加新节点的方法步骤 How to Add Node/Instance or Remove Node/Instance in 10gR2, 11gR1, 11gR2 and 12c Oracle Clusterware and RAC

    [总文档]How to Add Node/Instance or Remove Node/Instance in 10gR2, 11gR1, 11gR2 and 12c Oracle Clusterw ...

  4. c# winform结合数据库动态生成treeview的父节点和子节点方法和思路

    tb_food表的结构如图一: tb_foodtype表的结构如图二: //获取tb_foodtype表中的所有数据 private void InitDataTable() { SqlConnect ...

  5. JS获取父、兄、子节点

    一.jQuery的父节点查找方法 $(selector).parent(selector):获取父节点 $(selector).parentNode:以node[]的形式存放父节点,如果没有父节点,则 ...

  6. jQuery获取父级、兄弟节点的方法

    一.jQuery的父节点查找方法 $(selector).parent(selector):获取父节点 $(selector).parentNode:以node[]的形式存放父节点,如果没有父节点,则 ...

  7. 遍历DOM树,获取子节点

    获取子节点的方法有:  方法  说明  children()  选取子节点,可以带过滤参数.但只能选择子节点,不能选择孙子节点.  find()  选取子节点,可以带过滤参数.可以选择子节点及孙子节点 ...

  8. jQuery树形菜单(1)jquery.treeview

    jQuery的树形插件资料URL:http://bassistance.de/jquery-plugins/jquery-plugin-treeview/从该网站Download得到jquery.tr ...

  9. DOM基础之“寻找”子节点

    今天学习了JS中的DOM的内容,虽然小菜的理解不深,但希望能够记录下来,慢慢一点一点的进步,有更深的理解了,再回来补充. 首先,关于DOM的概念: 1.概念:DOM = document(文档)Obj ...

随机推荐

  1. C#实现在CAD图纸中插入另一个DWG图块的代码

    C#实现在CAD图纸中插入另一个DWG图块的代码 PromptPointResult ppr = ed.GetPoint("请选择插入点:"); Point3d pt = ppr. ...

  2. 【网络收集】order by 自定义排序

    使用order by排序,有时候不是根据字符或数字顺序,而是根据实际要求排序. 例如有客户A,B,C,我希望排序结果是B,C,A,那么就要通过自定义的规则排序. 第一种方法,可以构造一张映射表,将客户 ...

  3. MySQL中DATE_FORMATE函数内置字符集解析

    今天帮同事处理一个SQL(简化过后的)执行报错: 代码如下 复制代码 mysql> select date_format('2013-11-19','Y-m-d') > timediff( ...

  4. byte[] 清空

    1. using(byte buff = new byte[Size]){  // 你要用的代码,} 2. Array.Clear(bytes, 0 ,bytes.Length);

  5. Winform实现鼠标可穿透的窗体镂空效果

    今天找到一个名叫LICEcap的录屏软件,录制界面是这样的:     这个炫酷的空心窗口就是镜头,调整好大小,然后对准需要录制的地方按下Record就可以生成gif了. 卧槽太NB了我也要做一个! 根 ...

  6. Stack Overflow 2016最新架构探秘

    这篇文章主要揭秘 Stack Overflow 截止到 2016 年的技术架构. 首先给出一个直观的数据,让大家有个初步的印象. 相比于 2013 年 11 月,Stack Overflow 在 20 ...

  7. Linux系统目录分析

    Linux系统目录分析 /bin :系统指令目录(如ls.cp.mv等指令) /dev :系统设备目录 /home :系统用户的家,每一个系统用户都在此目录下有一个自己的家,每次登录时,系统都会自动登 ...

  8. C++虐恋:MBCS安装失败导致的四天误工

    情况描述:接收远程队友的C++代码,基于vc120工具集(VS2013),而我的机器上是VS2015,需要安装VS2013(只选MFC,除主程序与MFC外其余的组件全部卸掉).然后开始编译,提示 MS ...

  9. 火狐谷歌浏览器Json查看插件

    1.搜: Firefox的JSON插件 参考: Chrome/FireFox浏览器下处理JSON的插件_Bruce_新浪博客 JSONView :: Firefox 附加组件 但是后来去发现没用: 打 ...

  10. 火星坐标系 (GCJ-02) 与百度坐标系 (BD-09) 的转换算法

    $x_pi = 3.14159265358979324 * 3000.0 / 180.0; //火星坐标系 (GCJ-02)转百度坐标系 (BD-09)算法 function bd_encrypt($ ...