我想要一棵带图形树的代码，可动态生成的。

<%@ language="JScript"%>
<%
Response.buffer=false;
Response.Expires=0;
Server.ScriptTimeOut=5000;
var mdbpath="data/data.mdb";
var rs=Server.CreateObject("ADODB.Recordset");
var con="provider=microsoft.jet.oledb.4.0;data source="+Server.mappath(mdbpath);
%>
<head>
<style type="text/css">
body,td,a{
font-size:9pt;
color:#033865;
text-decoration:none;
}
.Tclose{
list-style-image:url("images/close.gif");
cursor:hand;
}
.Topen{
list-style-image:url("images/open.gif");
cursor:hand;
}
.TLclose{
display:none;
list-style-image:url("images/line.gif");
}
.TLopen{
list-style-image:url("images/line.gif");
}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>课程目录树</title>
</head>
<body leftmargin="0" topmargin="0" bgcolor="#f4f4f4" background="images/bg.gif"><script language="JScript">
function AddTree(word,id,topid){
var topobj=null;
if(!eval("window.T"+topid)){
MarkDiv.insertAdjacentHTML("beforeEnd","<li id='T"+topid+"' class='Tclose'></li><ul id='T"+topid+"_list' class='TLclose'></ul>");
}
topobj=eval("window.T"+topid+"_list");
if(eval("window.T"+id)){
var InsertTreeobj=eval("window.T"+id);
nsertTreeobj.innerHTML=word;
var InsertTreeListobj=eval("window.T"+id+"_list");
topobj.insertAdjacentHTML("beforeEnd",InsertTreeobj.outerHTML+InsertTreeListobj.outerHTML);
InsertTreeobj.outerHTML="";
InsertTreeListobj.outerHTML="";
}
else{
topobj.insertAdjacentHTML("beforeEnd","<nobr><li id='T"+id+"' class='Tclose'>"+word+"</li></nobr><ul id='T"+id+"_list' class='TLclose'></ul>");
}
}function AddLink(word,url,id,topid){
var topobj=null;
if(!eval("window.T"+topid)){
MarkDiv.insertAdjacentHTML("beforeEnd","<li id='T"+topid+"' class='Tclose'></li><ul id='T"+topid+"_list' class='TLclose'></ul>");
}
topobj=eval("window.T"+topid+"_list");
if(eval("window.L"+id)){
var InsertLinkobj=eval("window.L"+id);
topobj.insertAdjacentHTML("beforeEnd",InsertLinkobj.outerHTML);
InsertLinkobj.outerHTML="";
}
else{
topobj.insertAdjacentHTML("beforeEnd","<nobr><li id='L"+id+"'><a href='"+url+"' target='_blank'>"+word+"</a></li></nobr>");
}
}
function ChangeTree(){
var obj=event.srcElement;
var objlist=eval("window."+obj.id+"_list");
if(event.srcElement.className=="Tclose"){
obj.className="Topen";
objlist.className="TLopen";
return;
}
if(event.srcElement.className=="Topen"){
obj.className="Tclose";;
objlist.className="TLclose";
return;
}
}
</script>
<table style="position:absolute;left:-20"><tr><td>
<ul class="TLopen" id="MarkDiv" style="display:none" onclick="ChangeTree()">
<li id="T0" class="Topen">在线课程</li>
<ul id="T0_list" class="TLopen">
</td></tr></table>
<%
Response.write("<script language='JScript'>");
//==== 查找所有父树语句 ====
var sql="select * from tree where istop like '1'";
rs.open(sql,con,3,3);
while(!rs.eof){
Response.write("AddTree('"+rs("text")+"','"+rs("id")+"','"+rs("topid")+"');");
rs.movenext();
}
rs.close();
//==== 查找所有子树语句 ====
var sql="select * from tree where istop like '0'";//子
rs.open(sql,con,3,3);
while(!rs.eof){
Response.write("AddLink('"+rs("text")+"','"+rs("url")+"','"+rs("id")+"','"+rs("topid")+"');");
rs.movenext();
}
rs.close();
re=null;
Response.write("MarkDiv.style.display='';");
Response.write("</script>");
%>
</body>
</html>

解决方案 »

  1.   

    <%@ language="JScript"%>
    <%
    Response.buffer=false;
    Response.Expires=0;
    Server.ScriptTimeOut=5000;
    var mdbpath="data/data.mdb";
    var rs=Server.CreateObject("ADODB.Recordset");
    var con="provider=microsoft.jet.oledb.4.0;data source="+Server.mappath(mdbpath);
    %>
    <head>
    <style type="text/css">
    body,td,a{
    font-size:9pt;
    color:#033865;
    text-decoration:none;
    }
    .Tclose{
    list-style-image:url("images/close.gif");
    cursor:hand;
    }
    .Topen{
    list-style-image:url("images/open.gif");
    cursor:hand;
    }
    .TLclose{
    display:none;
    list-style-image:url("images/line.gif");
    }
    .TLopen{
    list-style-image:url("images/line.gif");
    }
    </style>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    <title>课程目录树</title>
    </head>
    <body leftmargin="0" topmargin="0" bgcolor="#f4f4f4" background="images/bg.gif"><script language="JScript">
    function AddTree(word,id,topid){
    var topobj=null;
    if(!eval("window.T"+topid)){
    MarkDiv.insertAdjacentHTML("beforeEnd","<li id='T"+topid+"' class='Tclose'></li><ul id='T"+topid+"_list' class='TLclose'></ul>");
    }
    topobj=eval("window.T"+topid+"_list");
    if(eval("window.T"+id)){
    var InsertTreeobj=eval("window.T"+id);
    nsertTreeobj.innerHTML=word;
    var InsertTreeListobj=eval("window.T"+id+"_list");
    topobj.insertAdjacentHTML("beforeEnd",InsertTreeobj.outerHTML+InsertTreeListobj.outerHTML);
    InsertTreeobj.outerHTML="";
    InsertTreeListobj.outerHTML="";
    }
    else{
    topobj.insertAdjacentHTML("beforeEnd","<nobr><li id='T"+id+"' class='Tclose'>"+word+"</li></nobr><ul id='T"+id+"_list' class='TLclose'></ul>");
    }
    }function AddLink(word,url,id,topid){
    var topobj=null;
    if(!eval("window.T"+topid)){
    MarkDiv.insertAdjacentHTML("beforeEnd","<li id='T"+topid+"' class='Tclose'></li><ul id='T"+topid+"_list' class='TLclose'></ul>");
    }
    topobj=eval("window.T"+topid+"_list");
    if(eval("window.L"+id)){
    var InsertLinkobj=eval("window.L"+id);
    topobj.insertAdjacentHTML("beforeEnd",InsertLinkobj.outerHTML);
    InsertLinkobj.outerHTML="";
    }
    else{
    topobj.insertAdjacentHTML("beforeEnd","<nobr><li id='L"+id+"'><a href='"+url+"' target='_blank'>"+word+"</a></li></nobr>");
    }
    }
    function ChangeTree(){
    var obj=event.srcElement;
    var objlist=eval("window."+obj.id+"_list");
    if(event.srcElement.className=="Tclose"){
    obj.className="Topen";
    objlist.className="TLopen";
    return;
    }
    if(event.srcElement.className=="Topen"){
    obj.className="Tclose";;
    objlist.className="TLclose";
    return;
    }
    }
    </script>
    <table style="position:absolute;left:-20"><tr><td>
    <ul class="TLopen" id="MarkDiv" style="display:none" onclick="ChangeTree()">
    <li id="T0" class="Topen">在线课程</li>
    <ul id="T0_list" class="TLopen">
    </td></tr></table>
    <%
    Response.write("<script language='JScript'>");
    //==== 查找所有父树语句 ====
    var sql="select * from tree where istop like '1'";
    rs.open(sql,con,3,3);
    while(!rs.eof){
    Response.write("AddTree('"+rs("text")+"','"+rs("id")+"','"+rs("topid")+"');");
    rs.movenext();
    }
    rs.close();
    //==== 查找所有子树语句 ====
    var sql="select * from tree where istop like '0'";//子
    rs.open(sql,con,3,3);
    while(!rs.eof){
    Response.write("AddLink('"+rs("text")+"','"+rs("url")+"','"+rs("id")+"','"+rs("topid")+"');");
    rs.movenext();
    }
    rs.close();
    re=null;
    Response.write("MarkDiv.style.display='';");
    Response.write("</script>");
    %>
    </body>
    </html>
      

  2.   

    <%@ language="JScript"%>
    <%
    Response.buffer=false;
    Response.Expires=0;
    Server.ScriptTimeOut=5000;
    var mdbpath="data/data.mdb";
    var rs=Server.CreateObject("ADODB.Recordset");
    var con="provider=microsoft.jet.oledb.4.0;data source="+Server.mappath(mdbpath);
    %>
    <head>
    <style type="text/css">
    body,td,a{
    font-size:9pt;
    color:#033865;
    text-decoration:none;
    }
    .Tclose{
    list-style-image:url("images/close.gif");
    cursor:hand;
    }
    .Topen{
    list-style-image:url("images/open.gif");
    cursor:hand;
    }
    .TLclose{
    display:none;
    list-style-image:url("images/line.gif");
    }
    .TLopen{
    list-style-image:url("images/line.gif");
    }
    </style>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    <title>课程目录树</title>
    </head>
    <body leftmargin="0" topmargin="0" bgcolor="#f4f4f4" background="images/bg.gif"><script language="JScript">
    function AddTree(word,id,topid){
    var topobj=null;
    if(!eval("window.T"+topid)){
    MarkDiv.insertAdjacentHTML("beforeEnd","<li id='T"+topid+"' class='Tclose'></li><ul id='T"+topid+"_list' class='TLclose'></ul>");
    }
    topobj=eval("window.T"+topid+"_list");
    if(eval("window.T"+id)){
    var InsertTreeobj=eval("window.T"+id);
    nsertTreeobj.innerHTML=word;
    var InsertTreeListobj=eval("window.T"+id+"_list");
    topobj.insertAdjacentHTML("beforeEnd",InsertTreeobj.outerHTML+InsertTreeListobj.outerHTML);
    InsertTreeobj.outerHTML="";
    InsertTreeListobj.outerHTML="";
    }
    else{
    topobj.insertAdjacentHTML("beforeEnd","<nobr><li id='T"+id+"' class='Tclose'>"+word+"</li></nobr><ul id='T"+id+"_list' class='TLclose'></ul>");
    }
    }function AddLink(word,url,id,topid){
    var topobj=null;
    if(!eval("window.T"+topid)){
    MarkDiv.insertAdjacentHTML("beforeEnd","<li id='T"+topid+"' class='Tclose'></li><ul id='T"+topid+"_list' class='TLclose'></ul>");
    }
    topobj=eval("window.T"+topid+"_list");
    if(eval("window.L"+id)){
    var InsertLinkobj=eval("window.L"+id);
    topobj.insertAdjacentHTML("beforeEnd",InsertLinkobj.outerHTML);
    InsertLinkobj.outerHTML="";
    }
    else{
    topobj.insertAdjacentHTML("beforeEnd","<nobr><li id='L"+id+"'><a href='"+url+"' target='_blank'>"+word+"</a></li></nobr>");
    }
    }
    function ChangeTree(){
    var obj=event.srcElement;
    var objlist=eval("window."+obj.id+"_list");
    if(event.srcElement.className=="Tclose"){
    obj.className="Topen";
    objlist.className="TLopen";
    return;
    }
    if(event.srcElement.className=="Topen"){
    obj.className="Tclose";;
    objlist.className="TLclose";
    return;
    }
    }
    </script>
    <table style="position:absolute;left:-20"><tr><td>
    <ul class="TLopen" id="MarkDiv" style="display:none" onclick="ChangeTree()">
    <li id="T0" class="Topen">在线课程</li>
    <ul id="T0_list" class="TLopen">
    </td></tr></table>
    <%
    Response.write("<script language='JScript'>");
    //==== 查找所有父树语句 ====
    var sql="select * from tree where istop like '1'";
    rs.open(sql,con,3,3);
    while(!rs.eof){
    Response.write("AddTree('"+rs("text")+"','"+rs("id")+"','"+rs("topid")+"');");
    rs.movenext();
    }
    rs.close();
    //==== 查找所有子树语句 ====
    var sql="select * from tree where istop like '0'";//子
    rs.open(sql,con,3,3);
    while(!rs.eof){
    Response.write("AddLink('"+rs("text")+"','"+rs("url")+"','"+rs("id")+"','"+rs("topid")+"');");
    rs.movenext();
    }
    rs.close();
    re=null;
    Response.write("MarkDiv.style.display='';");
    Response.write("</script>");
    %>
    </body>
    </html>