基于Jquery tree 的一些技术想法

　　Jquery tree 如果用自带的样式做的话会显示+ - ... 这些样式。但是在实际设计中我们可能会自定义样式,通过这些天的研究，我终于做出了基于Jquery tree的自定义树。自定义了收缩事件。
　　屁话不多说，上代码： protected void Page_Load(object sender, EventArgs e) { string sqlCmd = "Select * from Special_NewsCatalog where SortID=" + Request.Params["SortID"].ToString() + " and ParentID=0 Order By Location"; DataTable dtThrid = DbHelperSQL.Query(sqlCmd).Tables[0]; StringBuilder sb = new StringBuilder(); sb.Append("["); foreach (DataRow dr in dtThrid.Rows) { sb.Append("{"); sb.Append("text:' " + (dr["CatalogName"].ToString().Length > 12 ? dr["CatalogName"].ToString().Substring(0, 12) + "..." : dr["CatalogName"].ToString()) + "',"); sb.Append("expanded: true,"); sb.Append("id:'" + dr["CatalogID"].ToString() + "'"); AddChildrenNode(GetChildNodes(dr["CatalogID"].ToSt ring()), sb); sb.Append("}"); } sb.Append("]"); string s = sb.ToString(); s = s.Replace("}{", "},{"); Response.Write(s); } private DataTable GetChildNodes(string parentID) { string sqlCmd = "Select * from Special_NewsCatalog where ParentID=" + parentID + " Order By Location"; DataTable dtChildren = DbHelperSQL.Query(sqlCmd).Tables[0]; return dtChildren; } private void AddChildrenNode(DataTable dt, StringBuilder sb) { if (dt.Rows.Count > 0) { string tag = "0"; sb.Append(",children:["); foreach (DataRow dr in dt.Rows) { string subimg = ""; string addimg = ""; string finImg = ""; DataTable tempData = DbHelperSQL.Query("Select count(*) from Special_NewsCatalog where ParentID=" + dr["CatalogID"].ToString()).Tables[0]; if (tempData.Rows[0][0].ToString() != "0") { finImg = addimg; tag = "1"; } else { finImg = subimg; tag = "0"; } Regex num = new Regex("/"); int count = (num.Matches(dr["Location"].ToString()).Count) * 10 + 5; sb.Append("{"); sb.Append("text:' " + (dr["CatalogName"].ToString().Length > 12 ? dr["CatalogName"].ToString().Substring(0, 10) + "..." : dr["CatalogName"].ToString()) + "',"); sb.Append("expanded: true,"); sb.Append("id:'" + dr["CatalogID"].ToString() + "'"); AddChildrenNode(GetChildNodes(dr["CatalogID"].ToSt ring()), sb); sb.Append("}"); } sb.Append("]"); } } 以上是生成一客Json 树。
　　接下去，我们运用强大的JS 进行处理 0) { obj.src="/images/sub.gif" ; if (ul.style.display=='none' ) { ul.style.display='block'; zkg=false; } } else { obj.src="/images/add.gif" ; if (ul.style.display=='block' ) { ul.style.display='none'; zkg=true; } } } } var canback=0; function changeSrc(id,sortID,tag) { if(canback==0) { var text= document.getElementById("ctl00_ContentPlaceHolder1 _lblSecond").innerText; document.getElementById("ctl00_ContentPlaceHolder1 _lblSecond").innerHTML="返回"+text+"首页"; canback=1; } document.getElementById("iframeNewsInfo").src="Spe cialInfo.aspx?CatalogID="+id+"&&SortID="+sortID+"&& rm="+Math.random(); } function returnBack(id,text) { canback=0; document.getElementById("ctl00_ContentPlaceHolder1 _lblSecond").innerText=text; document.getElementById("iframeNewsInfo").src="/Sp ecial/IFream.aspx?SortID="+id; } function SetWinHeight(obj) { var win=obj; if (document.getElementById) { if (win && !window.opera) { if (win.contentDocument && win.contentDocument.body.offsetHeight) win.height = win.contentDocument.body.offsetHeight; else if(win.Document && win.Document.body.scrollHeight) win.height = win.Document.body.scrollHeight; } } } function getElementsByClassName(n) { var classElements = [],allElements = document.getElementsByTagName('*'); for (var i=0; i 折叠目录 朋友有问题可以和我交流QQ:176620043