看到園友發(fā)表了一篇關(guān)于JS樹(shù)的文章，看了之后，覺(jué)得應(yīng)該可以精簡(jiǎn)不少代碼，
想到了以前做的項(xiàng)目里面用到了一個(gè)JS樹(shù)，于是試著修改了一下，現(xiàn)把代碼貼出來(lái)與大家共享，還請(qǐng)大家多扔磚頭！
<!DOCTYPE html PUBLIC "-//W
<head runat="server">
<title></title>
<script src="JS/Tree.js" type="text/javascript"></script>
</head>
<body>
<form id="form1" runat="server">
<div>
<%-- <asp:TreeView ID="TreeView1" runat="server" ShowLines="True">
</asp:TreeView>--%>
<div id="treeOrgan"></div>
</div>
</form>
<script type="text/javascript" language="javascript">
var tree;
window.onload = function()
{
if (tree != "") {
tree = new treeview("treeview", "../images/Tree", false, false);
var parNode = new node("人員列表", "人員列表", "", "0", "F", false, "");
//caption, title, url, target, tag,check,callback
tree.add(parNode);
tree.create(document.getElementById("treeOrgan"));
InitNode(0, parNode);
parNode.expand();
}
}
function InitNode(id, parNode) {
if (parNode.nodes.length > 0) {
parNode.toggle();
}
else {
//parNode.DeleteChildren();
var result = WebApplicationJsTree._Default.GetJson(id).value;
if (result != null && result != "") {
var data = eval('(' + result + ')');
for (var i = 0; i < data.length; i++) {
var pn = new node(data[i].NAME, data[i].NAME, "", "P", data[i].id, true, "");
parNode.add(pn);
}
}
}
}
treeview.prototype.onnodeclick = function(sender) {
InitNode(sender.tag, sender);
sender.select();
sender.expand();
return false;
}
</script>
</body>
</html>
其實(shí)個(gè)人覺(jué)得用TreeView+linq to list也就連接一次服務(wù)器，對(duì)于小數(shù)據(jù)量性能也應(yīng)該蠻高的，代碼也在源碼包里面
在與客戶端交互上面，用服務(wù)器控件可以加上
tn.Text = "<span onclick=\"treeNodeClick(" + tn.ID + ")\">" + tn.Name;
數(shù)據(jù)庫(kù)結(jié)構(gòu)截圖：
FF下截圖：
喜歡 
頂
難過(guò)
囧
圍觀
無(wú)聊
