$.ajax({
type: "
post ",
url:"
WebForm1.aspx ? parentID = "+id,
dataType:"
xml ",
success: createTree
});
}
// 思路是每个父节点产生一个ul孩子并且ajax读取该父亲的直接儿子，拼接树
function createTree(xml) {
var obj = object1 == null ? ("#root ") : (object1);//判断是不是第一次加载，如果第一次加载则是最外的div的id,否则是父节点
$(obj).append(" < UL class = 'ULfather' > ");//添加ul对象
$(xml).find("
value ").each(function() {//从xml里读出所有value节点信息，得到当前层次节点
//拼接<li>和<a>,属性通过xml中的value节点的属性id和节点文本进行拼接
$(obj).children(".ULfather ").append(" < li > <a id = " + $(this).attr("
id ") + " > " + $(this).text() + " < /a></li > ");
var alink = "#" + $(this).attr("
id "); //得到当前超链接对象
$(alink).bind("
click ", function() { //超连接绑定点击事件
if ($(alink + " + ul ").size() <= 0) {//如果数据已经绑定则无需再次绑定，（如果超链接下个元素是ul的话，说明数据已经绑过）
object1 = $(alink).parent("
li ");
LoadXml($(this).attr("
id "))
}
else {
GetDisplayOrNot($(alink));
}
});
});
}
//节点显示或影藏
function GetDisplayOrNot(obj) {
if ($(obj).parent("
li ").children("
ul ").is(": hidden ")) {
$(obj).parent("
li ").children("
ul ").css("
display ", "
block ");
}
else {
$(obj).parent("
li ").children("
ul ").css("
display ", "
none ");
}
}
</script>
后台：
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data.Linq;
using System.Xml;
using System.Xml.Linq;
namespace WebApplication3
{
public partial class WebForm1 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
int id =Convert.ToInt32(Request["parentID"]);
GetXML(id);
}
public IList<Product> GetList()
{
return new List<Product>()
{
new Product(){ Id=1, ParentId=0, HasChild=1, Name="aaaaa" },
new Product(){ Id=2, ParentId=1, HasChild=1, Name="bbbb1" },
new Product(){ Id=3, ParentId=2, HasChild=0, Name="ccccc2" },
new Product(){ Id=4, ParentId=2, HasChild=0, Name="ddddd3" },
new Product(){ Id=5, ParentId=1, HasChild=0, Name="eeeeee4" },
new Product(){ Id=6, ParentId=3, HasChild=0, Name="ffffff5" },
new Product(){ Id=7, ParentId=4, HasChild=0, Name="ggggggg6" },
new Product(){ Id=8, ParentId=7, HasChild=0, Name="hhhhhhh7" },
new Product(){ Id=9, ParentId=0, HasChild=0, Name="jjjjjjj8" },
new Product(){ Id=10,ParentId=0, HasChild=0, Name="yyyyyyyy9" }
};
}
/// <summary>
/// 通过父节点读取子节点并且拼接成xml给前台
