java easyui tree例子_求大神给个easyui tree的例子，感谢！

展开全部

使用easyui 需要页面引用必须的js和css

// easyui tree 一般只需要url一个属性即62616964757a686964616fe4b893e5b19e31333335333734可显示数据，tree会自动ajax加载数据

// 至于点击树节点如何显示相应页面 ，tree 的json数据格式里面有attributes 可以自定义url

//就像下面例子中的  \"attributes\":{\"jsUrl\"……，下面的列子 是我在js里面拼接的tree json数据

/*********************************************************************************/

/*初始化树*/

InitTree: function () {

/*初始化树*/

$('#tree').tree({

animate: true,

//lines: true,

checkbox: false,

data: TableToXml.TreeData(),

onContextMenu: function (e, node) {

e.preventDefault(); //阻止浏览器默认右键菜单

// select the node

if (node.id != -1 && node.id != -2 && node.id != -3) {

$('#txt_xml').attr('disabled', 'true');

$('#btn_save').linkbutton('disable');

TableToXml.currtableName = node.id;

TableToXml.currJsUrl = node.attributes.jsUrl;

$('#mm').menu('show', {

left: e.pageX,

top: e.pageY

});

}

}

});

},

//组合树json数据

TreeData: function () {

var TreeJson = '[{\"id\":-1,\"text\":\"Tables\",\"children\":[';

TreeJson += '{\"id\":-2,\"text\":\"废水污染源核算\",\"children\":[';

for (var j = 0; j 

TreeJson += '{\"id\":\"' + TableToXml.tableArray[0][j].split('$')[0] + '\",\"text\":\"' + TableToXml.tableArray[0][j].split('$')[1] + '\",\"attributes\":{\"jsUrl\":\"' + TableToXml.tableArray[0][j].split('$')[2] + '\"}}';

if (j 

TreeJson += ',';

}

TreeJson += ']},';

TreeJson += '{\"id\":-3,\"text\":\"废气污染源核算\",\"state\": \"closed\",\"children\":[';

for (var j = 0; j 

TreeJson += '{\"id\":\"' + TableToXml.tableArray[1][j].split('$')[0] + '\",\"text\":\"' + TableToXml.tableArray[1][j].split('$')[1] + '\",\"attributes\":{\"jsUrl\":\"' + TableToXml.tableArray[1][j].split('$')[2] + '\"}}';

if (j 

TreeJson += ',';

}

TreeJson += ']}]}]';

TreeJson = eval("(" + TreeJson + ")");

return TreeJson;

},

另附API里tree

$('#tt').tree({

url: ...,//tree会自动ajax后台获取json格式数据(需要自己后台拼接)

loadFilter: function(data){

if (data.d){

return data.d;

} else {

return data;

}

}

});

多看看api吧……