当前位置： 移动技术网 > IT编程>开发语言>JavaScript > jQuery-EasyUI组件的tree扩展方法说明

jQuery-EasyUI组件的tree扩展方法说明

2019年03月02日  | 移动技术网IT编程  | 我要评论

jquery-easyui的tree扩展方法说明

包含以下内容：

树形结构基本说明 继承于tree的combotree 打开指定节点 查找当前节点处于第几级 附录java的tree实体文件

树形结构基本说明

样子

样子

数据格式

数据格式

数据如何绑定

分两种数据加载模式，第一种使用远程读取数据，通过get或post请求接口获得数据内容，也可以直接读取json文件

$('#tt').tree({    
    //url:'tree_data.json'
    url:'/tree/find'
});

另一种方式是使用静态数据，若需要将已经存在的数据放入控件，则直接使用自定义绑定data即可

$('#tt').tree({
    data: [{
        text: 'item1',
        state: 'closed',
        children: [{
            text: 'item11-1'
        },{
            text: 'item11-2'
        }]
    },{
        text: 'item2'
    }]
});

继承于tree的combotree

因为combotree既继承combo又继承tree，而其内的基础结构是属于combo的，只有在内包装了tree。所以要调用tree里面的方法，在conbotree的基础上先得获取到它的tree，取得tree内容后，参考tree的方法进行对应操作即可。

$('#tt').combotree('tree');

打开指定节点

因内容涉及到tree部分，则需要利用刚刚的内容，之后再使用expendto方法打开对应节点，因为需要target对象，所以我们只能通过id去找target对象，下面也封装了一个方法，调用传参即可

//方法传参为target，也就是说得获取到那个树形节点的对象才行
$('#'+treeid).combotree('tree').tree('expandto', target);

/**
 * 打开tree的指定节点，其他节点为默认关闭
 * @param treeid  树id
 * @param openid  要打开的节点id
 */
function tree_expandto(treeid, openid) {
    $('#'+treeid).combotree('tree').tree('expandto', 
            $('#'+treeid).combotree('tree').tree('find', openid).target);
}

查找当前节点处于第几级

本方法直接扩展加入了easyui-tree的方法内，直接调用即可

/**
 * 扩展easyui tree插件，得到当前结点的级数(即第几级)
 * 调用如下:
 * var node = $('#menus').tree("getselected");
 * var lv =  $('#menus').tree("getlevel",node.target);
 */
$.extend($.fn.tree.methods, {
    getlevel:function(jq,target){
        var l = $(target).parentsuntil("ul.tree","ul");
        return l.length+1;
    }
});

附录提供tree.java封装

import java.io.serializable;
import java.util.list;

/**
 * 对应easyui前端tree封装
 * @author around
 * @date 2018-4-26
 */
public class tree implements serializable {

    private static final long serialversionuid = 5350719828301693594l;

    private string id;

    private string text;

    private string url;

    /** 'state'可用值有：'checked','unchecked','indeterminate' */
    private string state;

    private string iconcls;

    private string description;

    private list children;

    /** 上级id */
    private string pid;

    private boolean checked;


    public list getchildren() {
        return children;
    }
    public void setchildren(list children) {
        this.children = children;
    }
    public string getid() {
        return id;
    }
    public void setid(string id) {
        this.id = id;
    }
    public string gettext() {
        return text;
    }
    public void settext(string text) {
        this.text = text;
    }
    public string geturl() {
        return url;
    }
    public void seturl(string url) {
        this.url = url;
    }
    public string getstate() {
        return state;
    }
    public void setstate(string state) {
        this.state = state;
    }
    public string geticoncls() {
        return iconcls;
    }
    public void seticoncls(string iconcls) {
        this.iconcls = iconcls;
    }
    public string getdescription() {
        return description;
    }
    public void setdescription(string description) {
        this.description = description;
    }
    public string getcode() {
        return code;
    }
    public void setcode(string code) {
        this.code = code;
    }
    public string getnavigation() {
        return navigation;
    }
    public void setnavigation(string navigation) {
        this.navigation = navigation;
    }
    public string getpid() {
        return pid;
    }
    public void setpid(string pid) {
        this.pid = pid;
    }
    public boolean ischecked() {
        return checked;
    }
    public void setchecked(boolean checked) {
        this.checked = checked;
    }

}

您可能感兴趣的文章:

如对本文有疑问， 点击进行留言回复！！

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网