jquery UI 的区域树

1.第一步引用javascript文件

<script type="text/javascript" src="js/ztree/jquery.ztree.core-3.5.js"></script>
<script type="text/javascript"src="js/ztree/jquery.ztree.excheck-3.5.js"></script>
<script src="js/selectAutocompleteTree.js"></script>
<script src="js/selectTree.js"></script>
<link rel="stylesheet" href="<%=basePath%>css/zTreeStyle/zTreeStyle.css"

selectTree.js文件

var setting = {
    check : {
        enable : true,
        chkStyle : "radio",
        radioType : "all"
    },
    view : {
        dblClickExpand : false
    },
    data : {
        simpleData : {
            enable : true
        }
    },
    callback : {
        onClick : onClick,
        onCheck : onCheck
    }
};
var setId="";
function onClick(e, treeId, treeNode) {
    var zTree = jQuery.fn.zTree.getZTreeObj("treeDemo");
    zTree.checkNode(treeNode, !treeNode.checked, null, true);
    return false;
}

function onCheck(e, treeId, treeNode) {
    var zTree = jQuery.fn.zTree.getZTreeObj("treeDemo"), nodes = zTree
            .getCheckedNodes(true), v = "",t="";
    for ( var i = 0, l = nodes.length; i < l; i++) {
        v += nodes[i].name + ",";
        t += nodes[i].id + ",";
    }
    if (v.length > 0)
        v = v.substring(0, v.length - 1);
    var cityObj = jQuery("#citySel");
    cityObj.attr("value", v);
    if (t.length > 0)
        t = t.substring(0, t.length - 1);
    jQuery("#"+setId).empty();
    jQuery("#"+setId).val(t);
}

function showMenu(id) {
    var cityObj = jQuery("#citySel");
    var cityOffset = jQuery("#citySel").offset();
    jQuery("#menuContent").css({
        left : cityOffset.left + "px",
        top : cityOffset.top + cityObj.outerHeight() + "px"
    }).slideDown("fast");

    jQuery("body").bind("mousedown", onBodyDown);
    setId=id;
}
function hideMenu() {
    jQuery("#menuContent").fadeOut("fast");
    jQuery("body").unbind("mousedown", onBodyDown);
}
function onBodyDown(event) {
    if (!(event.target.id == "menuBtn" || event.target.id == "citySel"
            || event.target.id == "menuContent" || jQuery(event.target)
            .parents("#menuContent").length > 0)) {
        hideMenu();
    }
}

function loadTree(url,ulName) {
    jQuery.ajax({
        type : "post",
        url : url,
        dataType : "json",
        async : false,
        success : function(data) {
            zNodes = eval(data);
        },
        error : function(data) {
            alert("返回数据失败");
        }
    });
    jQuery.fn.zTree.init(jQuery("#treeDemo"), setting, zNodes);
}

2.页面调用

    <div style="height:30px; padding-left:8px;padding-top: 6px;">
                            <table
                                style="width:140px;border:1px solid #79accf; height: 15px;">
                                <tr>
                                    <td><input type="text" value="" id="citySel"
                                        style="width:128px; height:15px;border:0"
                                        onclick="showMenu('urgencyDegree');" />
                                    </td>
                                    <td><img src="images/s.png" height="17px" width="15px"
                                        onclick="showMenu('urgencyDegree');"></img>
                                    </td>
                                </tr>
                            </table>
                            <input type="hidden" id="urgencyDegree" />
                 </div> 

3.java 后台代码

public void selectCityAllName() {
        String sql = "SELECT code, parentCode ,name FROM system_pcity";
        List<Object[]> cityName_list = commonBusinessSer.findSQLList(sql);
        String treelist = createTreeNode(cityName_list);
        JsonUtil.getInstance().obj2json(treelist);
    }

public String createTreeNode(List<Object[]> params) {
        StringBuffer sbuf = new StringBuffer();

        sbuf.append("[");
        for (int i = 0; i < params.size(); i++) {
            boolean flag = false;
            sbuf.append("{");
            String mid = "id:'" + params.get(i)[0] + "',";
            String pid = "pId:'" + params.get(i)[1] + "',";
            String name = "name:'" + params.get(i)[2] + "',";
            sbuf.append(mid);
            sbuf.append(pid);
            sbuf.append(name);
            if (i == 0) {
                sbuf.append("open:true,nocheck:true");
            } else {
                for (int k = 0; k < params.size(); k++) {
                    String id1 = params.get(i)[0].toString();
                    String pid1 = "";
                    if (params.get(k)[1] == null) {
                        pid1 = "";
                    } else {
                        pid1 = params.get(k)[1].toString();
                    }
                    if (pid1.equals(id1)) {
                        flag = true;
                        break;
                    }
                }
                if (flag) {
                    sbuf.append("open:false,nocheck:true");

                } else {
                    sbuf.append("open:false");
                }

            }

            sbuf.append("},");
        }
        sbuf.deleteCharAt(sbuf.length() - 1);
        sbuf.append("]");
        return sbuf.toString();
    }