复制代码代码如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Estricto//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<cabeza>
<title>Destroydrop » Javascripts » Árbol</title>
<enlace rel="Hoja de estilo" href="dtree.css" tipo="texto/css" />
<script tipo="text/javascript" src="dtree.js"></script>
</cabeza>
<cuerpo>
<div>
<p><a href="javascript: d.openAll();">abrir todo</a> | <a href="javascript: d.closeAll();">cerrar todo</a></p>
<tipo de script="texto/javascript">
<!--
d = nuevo dTree('d');
d.add(0,-1,'Mi árbol de ejemplo');
d.add(1,0,'Nodo 1','ejemplo01.html');
d.add(2,0,'Nodo 2','ejemplo01.html');
d.add(3,1,'Nodo 1.1','ejemplo01.html');
d.add(4,0,'Nodo 3','ejemplo01.html');
d.add(5,3,'Nodo 1.1.1','ejemplo01.html');
d.add(6,5,'Nodo 1.1.1.1','ejemplo01.html');
d.add(7,0,'Nodo 4','ejemplo01.html');
d.add(8,1,'Nodo 1.2','ejemplo01.html');
d.add(9,0,'Mis fotos','example01.html','Fotos que he tomado a lo largo de los años','','','img/imgfolder.gif');
d.add(10,9,'El viaje a Islandia','ejemplo01.html','Fotos de Gullfoss y Geysir');
d.add(11,9,'Cumpleaños de mamá','ejemplo01.html');
d.add(12,0,'Papelera de reciclaje','ejemplo01.html','','','img/trash.gif');
documento.write(d);
//-->
</script>
</div>
<p></p>
</cuerpo>
</html>
接下来我们可以分析 我们要是想让他动态的生成 我们 要怎么处理
我们可以看到如下代码是生成树的关键:
复制代码代码如下:
<div>
<p><a href="javascript: d.openAll();">abrir todo</a> | <a href="javascript: d.closeAll();">cerrar todo</a></p>
<tipo de script="texto/javascript">
<!--
d = nuevo dTree('d');
d.add(0,-1,'Mi árbol de ejemplo');
d.add(1,0,'Nodo 1','ejemplo01.html');
d.add(2,0,'Nodo 2','ejemplo01.html');
d.add(3,1,'Nodo 1.1','ejemplo01.html');
d.add(4,0,'Nodo 3','ejemplo01.html');
d.add(5,3,'Nodo 1.1.1','ejemplo01.html');
d.add(6,5,'Nodo 1.1.1.1','ejemplo01.html');
d.add(7,0,'Nodo 4','ejemplo01.html');
d.add(8,1,'Nodo 1.2','ejemplo01.html');
d.add(9,0,'Mis fotos','example01.html','Fotos que he tomado a lo largo de los años','','','img/imgfolder.gif');
d.add(10,9,'El viaje a Islandia','ejemplo01.html','Fotos de Gullfoss y Geysir');
d.add(11,9,'Cumpleaños de mamá','ejemplo01.html');
d.add(12,0,'Papelera de reciclaje','ejemplo01.html','','','img/trash.gif');
documento.write(d);
//-->
</script>
</div>
我们是不是可以把上面的代码写到.cs文件里面呢！ 是可以的
首先我们必须在数据库建立一张表
我们看下其实这里的这么多表字段 个人觉得pid子节点（如果是0那么就是根节点，1子节点，3子节点的子节点） nombre要显示的名称 url连接地址título标题 icon关闭图片的路径 iconopen打开图片的路径 这里不详细介绍了 大家可以试下我们最主要的就是根据nombre de usuario 进行判断 大家也可以是把nombre de usuario换成是引用的字段Vista de árbol
Tabla de datos
复制代码代码如下:
DataSet privado GetDt (nombre de usuario de cadena)
{
string strConn="servidor=ZHOUYUN;base de datos=Miprueba;uid=sa;pwd=123456";
Conexión SqlConnection = nueva SqlConnection(strConn);
cadena strSql = cadena.Formato("
seleccione * de la vista de árbol donde nombre de usuario ='{0}'",nombre de usuario);
SqlDataAdapter da = nuevo SqlDataAdapter(strSql, conn);
Conjunto de datos ds = nuevo Conjunto de datos();
da.Fill(ds);
devolver ds;
}
然后我们把先我们生成书的js放到.cs文件里面来 非常关键的一个就是注意.js文件的倒入和 .css文件的倒入 我们可以用到Page.hearder.innerHTMl=""你要倒入的文件名
我们来看代码
复制代码代码如下:
vista de árbol pública vacía()
{
//实力化一个长字符串类型
StringBuilder strbu = nuevo StringBuilder();
//我们在生成一个保留静态文本的位置的类
Literal iluminado = nuevo Literal();
//这里就是我们刚才提到的要把.js和.cs文件倒入的位置
//page.Header.InnerHtml的意思就是把这段文件引用放到html标签里的
// <cabeza>这个之间</cabeza>
Página.Header.InnerHtml = @"<
enlace rel='StyleSheet' href='dtree.css' tipo='text/css'/>
<script type='text/javascript' src='dtree.js'></script>";//倒入结束
cadena nombre de usuario = "zhangsan";
DataSet ds = GetDt(nombre de usuario.Trim());
Tabla de datos dt = ds.Tables[0];
//我们现在开始把js文件放到长字符串类型里面
strbu.Append(@"<div class='dtree'>
<p><a href='javascript: d.openAll();'>abrir todo</a> |
<a href='javascript: d.closeAll();'>cerrar todo</a></p>
<tipo de script='texto/javascript'>
<!--
d = nuevo dTree('d');
d.add(0,-1,'Mi árbol de ejemplo');");//这里结束一段长字符穿类型
// 我们开始循环DataTable
para (int i = 1; i < dt.Rows.Count; i++)
{
//我们又开始添加长文件类型 大家这里注意了拼接字符穿
//的时候要仔细点
strbu.Agregar(@"
d.add(" + i + "," + dt.Rows["pid"] + ","'" +
dt.Rows["nombre"] + "','" +
dt.Rows["url"] + "','" +
dt.Rows["objetivo"] + "','" +
dt.Rows["icono"] + "','"+
dt.Rows["iconopen"]+"');");
}
//再次添加长文件类型
strbu.Append(@"document.write(d);
-->
</script>
</div> "); //长文件类型添加结束
//现在我们保留静态文本的text值就等于 我们刚才的长文件类型的值
iluminado.Texto = Convert.ToString(strbu);
//那么我们在想 我怎么把个段文本放到<cuerpo>
//<form>这个位置呢</form><boy>
form1.InnerHtml = "";
//我们可以直接从.cs文件里面获得form1然后.Controls.Add()
//他只能放静态文本所以我们把刚才长文件类型的值赋给了静态文本
//那么我们这里也就可以直接添加进来了
form1.Controls.Add(iluminado);
}