基于jQuery的树结构，允许多选、单选
  需要⼀个可以选择部门的功能，开始选⽤的是easyUI tree，不过最后被嫌弃了，只好寻更优的解决⽅法，当然也可以通过异步加载的⽅式来避免⼀次性载⼊速度慢的问题，但这不在考虑范围内。
  这⾥要讨论的就是如何将现有的插件改造成⾃⼰想要的，原插件是多选的，⽽这⾥选择部门只需要选择⼀个就可以了，简单点可以通过限定最终的选定的结果数量来限制，但是选择框还是checkbox，既然要⽤那么就整像样点，所以就来动⼿改造成radio的形式，原插件扩展也是⾮常容易的，只需要做简单的修改就可以满⾜⾃⼰的要求。
  1、⾸先是插件的设置，⼀处是覆盖checkbox的0、1状态的图标，⽤准备好的radio来替换，另⼀处就是覆盖checkbox的点击⽅法
1var o = {
2                showcheck: true,
3                theme: "bbit-tree-lines", //bbit-tree-lines ,bbit-tree-no-lines,bbit-tree-arrows
4                icons: ["radio_0.gif", "radio_1.gif", "checkbox_2.gif"],
5                oncheckboxclick:function(item){
6                    $("#tree").clear();
7var s = item.checkstate != 1 ? 1 : 0;
8                    $("#tree").nodeclick(item,s);
9return true;
10                }
11            };
  2、需要在插件⾥增加2个⽅法，就是前⾯点击事件⽤到的⽅法
1//重置所有选中项
2    $.fn.clear = function() {
3if (this[0].t) {
4return this[0].t.clear();
easyui插件5        }
6return null;
7    };
8//节点点击
9    $.fn.nodeclick = function(item,s) {
10if (this[0].t) {
11this[0].t.check(item,s);
12        }
13    };
  3、我采⽤的数据是⽤java后台输出json，对象的属性⾸页字母输出是⼩写，原插件的⼦结点名为ChildNodes，我这边改成了childNodes。
效果图如下：

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。