基于jQuery的树结构，允许多选、单选

　　需要一个可以选择部门的功能，开始选用的是easyUI tree，不过最后被嫌弃了，只好寻找更优的解决方法，当然也可以通过异步加载的方式来避免一次性载入速度慢的问题，但这不在考虑范围内。

　　终于在《打造基于jQuery的高性能TreeView》中找到了一个不错的东东，具体就不用多说，看原文就可以。http://www.cnblogs.com/xuanye/archive/2009/10/26/1590250.html

　　这里要讨论的就是如何将现有的插件改造成自己想要的，原插件是多选的，而这里选择部门只需要选择一个就可以了，简单点可以通过限定最终的选定的结果数量来限制，但是选择框还是checkbox，既然要用那么就整像样点，所以就来动手改造成radio的形式，原插件扩展也是非常容易的，只需要做简单的修改就可以满足自己的要求。

　　1、首先是插件的设置，一处是覆盖checkbox的0、1状态的图标，用准备好的radio来替换，另一处就是覆盖checkbox的点击方法

var o = {
                showcheck: true,          
                theme: "bbit-tree-lines", //bbit-tree-lines ,bbit-tree-no-lines,bbit-tree-arrows
                icons: ["radio_0.gif", "radio_1.gif", "checkbox_2.gif"],
                oncheckboxclick:function(item){
                    $("#tree").clear();
                    var s = item.checkstate != 1 ? 1 : 0;
                    $("#tree").nodeclick(item,s);
                    return true;
                }
            };

　　2、需要在插件里增加2个方法，就是前面点击事件用到的方法

//重置所有选中项
    $.fn.clear = function() {
        if (this[0].t) {
            return this[0].t.clear();
        }
        return null;
    };
    //节点点击
    $.fn.nodeclick = function(item,s) {
        if (this[0].t) {
            this[0].t.check(item,s);
        }
    };

　　3、 我采用的数据是用java后台输出json，对象的属性首页字母输出是小写，原插件的子结点名为ChildNodes,我这边改成了childNodes。

效果图如下：

 

 https://files.cnblogs.com/longterm/treeview_radio.rar