修復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