<html xmlns="http://www.w3.org/1999/xhtml"> <head id="Head1" runat="server"> <title>小山</title> <link type="text/css" href="../../Styles/tree_css/tree.css" rel="stylesheet"> </head> <body> <form id="Form1" runat="server"> <table width=100% cellpadding=0 cellspacing=0 border=0> <colgroup> <col width=180 /> <col /> </colgroup> <tr> <td> <div class="TreeMenu" id="CategoryTree" style="width: 100%; height: 489px"> </div> </td> <td> <iframe id=furl height=20 style="height: 497px; width: 100%;"></iframe> </td> </tr> </table> <script language="jscript"> function el(id) { return document.getElementById(id); } function ExpandSubCategory(iCategoryID) { var li_father = el("li_"+ iCategoryID); if (li_father.getElementsByTagName("li").length >0) //分类已下载 { ChangeStatus(iCategoryID); return; } li_father.className ="Opened"; switchNote(iCategoryID, true); AjaxMethod.GetSubCategory(iCategoryID, GetSubCategory_callback); } function GetSubCategory_callback(response) { var dt = response.value.Tables[0]; if (dt.Rows.length >0) { var iCategoryID = dt.Rows[0].FatherID; } var li_father = el("li_"+ iCategoryID); var ul = document.createElement("ul"); for (var i =0;i < dt.Rows.length;i++) { if (dt.Rows[i].IsChild ==1) //叶子节点 { var li = document.createElement("li"); li.className ="Child"; li.id ="li_"+ dt.Rows[i].CategoryID; var img = document.createElement("img"); img.id = dt.Rows[i].CategoryID; img.className ="s"; img.src ="../../Styles/tree_css/s.gif"; var a = document.createElement("a"); var id = dt.Rows[i].CategoryID; a.onmouseover =function() { PreviewImage(id); }; a.href ="javascript:OpenDocument('"+ dt.Rows[i].CategoryID +"');"; a.innerHTML = dt.Rows[i].CategoryName; } else { var li = document.createElement("li"); li.className ="Closed"; li.id ="li_"+ dt.Rows[i].CategoryID; var img = document.createElement("img"); img.id = dt.Rows[i].CategoryID; img.className ="s"; img.src ="../../Styles/tree_css/s.gif"; img.onclick =function () { ExpandSubCategory(this.id); }; img.alt ="展开/折叠"; var a = document.createElement("a"); a.href ="javascript:ExpandSubCategory("+ dt.Rows[i].CategoryID +");"; a.innerHTML = dt.Rows[i].CategoryName; } li.appendChild(img); li.appendChild(a); ul.appendChild(li); } li_father.appendChild(ul); switchNote(iCategoryID, false); } // 叶子节点的单击响应函数 function OpenDocument(iCategoryID) { // 预加载信息 PreloadFormUrl(iCategoryID); } function PreviewImage(iCategoryID) { } function ChangeStatus(iCategoryID) { var li_father = el("li_"+ iCategoryID); if (li_father.className =="Closed") { li_father.className ="Opened"; } else { li_father.className ="Closed"; } } function switchNote(iCategoryID, show) { var li_father = el("li_"+ iCategoryID); if (show) { var ul = document.createElement("ul"); ul.id ="ul_note_"+ iCategoryID; var note = document.createElement("li"); note.className ="Child"; var img = document.createElement("img"); img.className ="s"; img.src ="../../Styles/tree_css/s.gif"; var a = document.createElement("a"); a.href ="javascript:void(0);"; a.innerHTML ="请稍候"; note.appendChild(img); note.appendChild(a); ul.appendChild(note); li_father.appendChild(ul); } else { var ul = el("ul_note_"+ iCategoryID); if (ul) { li_father.removeChild(ul); } } } // 加载根节点 var tree = el("CategoryTree"); var root = document.createElement("li"); root.id ="li_0"; tree.appendChild(root); // 加载页面时显示第一级分类 ExpandSubCategory(0); function PreloadFormUrl(iCategoryID) { // 采用同步调用的方式获取图片的信息 var ds = AjaxMethod.GetFormsList(iCategoryID).value; // 如果返回了结果 if (ds) { // 判断数据表是否不为空 if (ds.Tables[0].Rows.length >0) { // 返回的信息数据表 dt = ds.Tables[0]; el("furl").src = dt.Rows[0].FormUrl; } else// 分类下没有 { } } } </script> </form> </body> </html>
2.cs代码
using System; using System.Data; using System.Configuration; using System.Collections; using System.Web; using System.Web.Security; using System.Web.UI; using System.Web.UI.WebControls; using System.Web.UI.WebControls.WebParts; using System.Web.UI.HtmlControls; using AjaxPro; public partial class Pages_Home_HomePage : System.Web.UI.Page { protectedvoid Page_Load(object sender, EventArgs e) { Utility.RegisterTypeForAjax(typeof(AjaxMethod)); } }