国产精品成人v,日韩在线丝袜视频,91视频人人

JavaScript + XML樹型菜單

轉(zhuǎn)帖|其它|編輯：郝浩|2008-09-03 11:30:17.000|閱讀 2203 次

概述：JavaScript + XML樹型菜單

# 界面/圖表報表/文檔/IDE等千款熱門軟控件火熱銷售中 >>

思路：利用ASP讀取數(shù)據(jù)庫數(shù)據(jù)，生成XML文件，然后用JS調(diào)入XML數(shù)據(jù)生成樹型菜單

1.數(shù)據(jù)結(jié)構(gòu)

表名：InfoClass

字段名稱　　數(shù)據(jù)類型  說明

SID　　　　　int   類別ID

SName 　　nvarchar(50) 　　類別名稱

ParentID　　 int 父類ID,根分類父ID為0

2.ASP生成XML文件程序

<%@LANGUAGE="VBSCRIPT" CODEPAGE="65001"%>
<%
Session.CodePage = "65001"
Response.Charset = "utf-8"

Call InfoClass()

Sub BuildXMLStr(pid,str) ''遞歸類別及其子類別存入字符串

    Dim crs,tempStr
    Set crs=Server.CreateObject("ADODB.Recordset")
    Set crs=cn.Execute("Select SID,SName,ParentID From [InfoClass] Where ParentID="&pid&" Order By ParentID Asc,SID Desc")

    Do While (crs.Eof=False)

        tempStr = " id=''" & crs("SID") &"''"
        If (crs("ParentID") = 0) Then
            str = str & "<rootLevel" & tempStr & ">" & vbcrlf
            str = str & "<selfName>" & crs("SName") & "</selfName>" & vbcrlf
        Else
            str = str & "<level" & tempStr & ">" & vbcrlf
            str = str & "<selfName>" & crs("SName") & "</selfName>" & vbcrlf
            str = str & "<parentID>" & crs("parentID") & "</parentID>" & vbcrlf
        End If

        Call BuildXMLStr(crs("SID"),str) ''遞歸調(diào)用

        If (crs("ParentID") = 0) Then
            str = str & "</rootLevel>" & vbcrlf
        Else
            str = str & "</level>" & vbcrlf
        End If

        crs.MoveNext()

    Loop

    crs.Close():Set crs=Nothing

End Sub

Sub SaveXMLFile(str)
    Dim stream
    Set stream = Server.CreateObject("ADODB.Stream")
    stream.Type = 2
    stream.Mode = 3
    stream.Charset = "utf-8"
    stream.Open()
    stream.WriteText(str)
    stream.SaveToFile Server.MapPath("/XML/InfoClass.xml"),2
    stream.Close()
    Set stream = Nothing
End Sub

Sub InfoClass()

    Response.ContentType = "text/xml"
    Dim str
    str = "<?xml version=''1.0'' encoding=''utf-8''?>" & vbcrlf
    str = str & "<menu>" & vbcrlf
    Call BuildXMLStr(0,str)
    str = str & "</menu>"

    Call SaveXMLFile(str)
    Response.ContentType = "text/html"

End Sub
%>

3.XML文件結(jié)構(gòu)

<?xml version=''1.0'' encoding=''utf-8''?>
<menu>
<rootLevel id=''2''>
<selfName>美國</selfName>
</rootLevel>
<rootLevel id=''1''>
<selfName>中國</selfName>
<level id=''4''>
<selfName>河南</selfName>
<parentID>1</parentID>
</level>
<level id=''3''>
<selfName>山東</selfName>
<parentID>1</parentID>
<level id=''6''>
<selfName>菏澤</selfName>
<parentID>3</parentID>
<level id=''8''>
<selfName>曹縣</selfName>
<parentID>6</parentID>
</level>
<level id=''7''>
<selfName>東明</selfName>
<parentID>6</parentID>
</level>
</level>
<level id=''5''>
<selfName>濟南</selfName>
<parentID>3</parentID>
</level>
</level>
</rootLevel>
</menu>

4.JavaScript構(gòu)建樹型菜單

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "//www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="//www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>JavaScript + XML樹型菜單</title>
<style type="text/css">
li.plus
{
    list-style-type:none;
    list-style-image:url(Images/Plus.png); /*展開時圖片,如"+"*/
    cursor:hand;
}

li.minus
{
    list-style-type:none;
    list-style-image:url(Images/Minus.png); /*折疊時圖片,如"-"*/
    cursor:hand;
}

li.item
{
    list-style-type:none;
    list-style-image:url(Images/Item.png); /*無子項目時圖片*/
    cursor:hand;
}
</style>
</head>

<body>
<ul id="tree">
<li>樹</li>
</ul>
<script language="javascript" type="text/javascript">
treeMenu("tree"); //樹

function closeChild(li,childUL) //折疊函數(shù)
{
    li.className = "plus"; //展開圖標

    for (var j=0;j<childUL.length;j++) //循環(huán)刪除ul,ul可能有子ul、li孫ul、li
    {childUL[j].parentNode.removeChild(childUL[j]);}
}

function cancelBuble(domEvent) //停止事件冒泡函數(shù),跨瀏覽器解決方案
{
    if (window.ActiveXObject) //IE
    {domEvent.cancelBubble = true;}
    else //FireFox
    {domEvent.stopPropagation();}
}
</script>
</body>
</html>

標簽：

本站文章除注明轉(zhuǎn)載外，均為本站原創(chuàng)或翻譯。歡迎任何形式的轉(zhuǎn)載，但請務必注明出處、不得修改原文相關(guān)鏈接，如果存在內(nèi)容上的異議請郵件反饋至chenjj@fc6vip.cn

文章轉(zhuǎn)載自：DIY部落

上一篇：谷歌Chrome面世　引爆瀏覽器市場紛爭　下一篇：C#代碼與javaScript函數(shù)的相互調(diào)用