zoukankan      html  css  js  c++  java
  • 修复jquery.treeview的增加子节点的方法的bug

      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
            });
    View Code

    但是此方法有个很严重的问题,就是增加的节点必须只能是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;
            });
    View Code
  • 相关阅读:
    严重: Parse error in application web.xml file at jndi:/localhost/ipws/WEBINF/web.xml java.lang.NoSuchMethodException: org.apache.catalina.deploy.WebXml
    Failed to install .apk on device 'emulator5554': timeout解决方法
    java.lang.NoClassDefFoundError:org.jsoup.Jsoup
    Conversion to Dalvik format failed: Unable to execute dex:解决方法
    apache Digest: generating secret for digest authentication ...
    Description Resource Path Location Type Project has no default.properties file! Edit the project properties to set one.
    android service随机自启动
    MVC3 安装部署
    EF 4.3 CodeBased 数据迁移演练
    SQL Server 2008开启sa账户
  • 原文地址:https://www.cnblogs.com/Mr-Nobody/p/3530526.html
Copyright © 2011-2022 走看看