 无限深度菜单代码共享
两个文件,做好后直接访问navigater.xml navigater.xml: <?xml version="1.0" encoding="GB2312"?>
<?xml-stylesheet type="text/xsl" href="navigater.xsl"?>
<!-- 无限深度菜单 -->
<!--
如果使用本代码请保留以下版权信息.
本代码由Forlan编写, Soft@benheco.com
-->
<Root>
<Item>
<Text>父菜单(1)</Text>
<URL>#</URL>
<Item>
<Text>子菜单(1)</Text>
<URL>#</URL>
<Item>
<Text>子菜单的子菜单</Text>
<URL>http://www.benheco.com/soft/</URL>
</Item>
</Item>
</Item>
<Item>
<Text>父菜单(2)</Text>
<URL>#</URL>
<Item>
<Text>子菜单(2)</Text>
<URL>#</URL>
<Item>
<Text>子菜单的子菜单</Text>
<URL>http://www.163.com/</URL>
</Item>
</Item>
</Item>
</Root> navigater.xsl: <?xml version="1.0" encoding="GB2312"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:fo="http://www.w3.org/1999/XSL/Format">
<!-- 无限深度菜单 -->
<!--
如果使用本代码请保留以下版权信息.
本代码由Forlan编写, Soft@benheco.com
-->
<xsl:template match="/">
<html>
<head>
<title>Navigater</title>
<style>
<xsl:comment>
<![CDATA[
td { border-style: solid; border-width: 0 }
!]]>
</xsl:comment>
</style>
<script language="javascript">
<xsl:comment>
<![CDATA[
function OppNode(ParentNodeImg,Node)
{
if(Node.style.display == "none")
{
Node.style.display = "block";
ParentNodeImg.src = "Images/sub.gif";
}
else
{
Node.style.display = "none";
ParentNodeImg.src = "Images/plus.gif";
}
}
function OpenURL(URL)
{
parent.RightFrame.location = URL;
}
]]>
</xsl:comment>
</script>
</head>
<body topmargin="10" leftmargin="10" marginheight="10" marginwidth="10">
<xsl:attribute name="onselectstart">return false;</xsl:attribute>
<xsl:attribute name="ondragstart">return false;</xsl:attribute>
<xsl:call-template name="LinkPage">
<xsl:with-param name="Node" select="//Root"/>
<xsl:with-param name="ParentName">Root</xsl:with-param>
</xsl:call-template>
</body>
</html>
</xsl:template>
<!-- 递归加载所有菜单 -->
<xsl:template name="LinkPage">
<xsl:param name="Node"/>
<xsl:param name="ParentName"/>
<table width="90%" border="0" cellspacing="0" cellpadding="0">
<xsl:for-each select="$Node/Item">
<xsl:variable name="ChildrenID">
<xsl:value-of select="$ParentName"/>_<xsl:number value="position()"/>
</xsl:variable>
<tr>
<td>
<table width="50" border="0" cellspacing="0" cellpadding="0">
<xsl:choose>
<!-- 类别菜单下还有子菜单 -->
<xsl:when test="count(./Item/Text) != 0">
<!-- 类别菜单 -->
<xsl:call-template name="ParentLinkPage">
<xsl:with-param name="Node" select="."/>
<xsl:with-param name="ChildrenID" select="$ChildrenID"/>
</xsl:call-template>
<!-- 列出类别菜单下的子菜单(递归) -->
<tr style="display:none">
<xsl:attribute name="id"><xsl:value-of select="$ChildrenID"/></xsl:attribute>
<td/>
<td>
<xsl:call-template name="LinkPage">
<xsl:with-param name="Node" select="."/>
<xsl:with-param name="ParentName" select="$ChildrenID"/>
</xsl:call-template>
</td>
</tr>
</xsl:when>
<!-- 类别菜单下没有子菜单,直接显示链接菜单 -->
<xsl:otherwise>
<xsl:call-template name="ChildLinkPage">
<xsl:with-param name="Node" select="."/>
</xsl:call-template>
</xsl:otherwise>
</xsl:choose>
</table>
</td>
</tr>
</xsl:for-each>
</table>
</xsl:template>
<!-- 显示指定的一个类别菜单 -->
<xsl:template name="ParentLinkPage">
<xsl:param name="Node"/>
<xsl:param name="ChildrenID"/>
<xsl:variable name="ImgID"><xsl:value-of select="$ChildrenID"/>_Img</xsl:variable>
<tr>
<td width="10">
<img src="Images/plus.gif" style="CURSOR: hand;" border="0">
<xsl:attribute name="id"><xsl:value-of select="$ImgID"/></xsl:attribute>
<xsl:attribute name="onclick">javascript: OppNode(<xsl:value-of select="$ImgID"/>,<xsl:value-of select="$ChildrenID"/>)</xsl:attribute>
</img>
<xsl:text> </xsl:text>
</td>
<td width="50" nowrap="nowrap">
<table width="100%" border="0" cellspacing="0" cellpadding="2">
<xsl:attribute name="class">Menu_Blur</xsl:attribute>
<xsl:attribute name="onmouseover">javascript: this.className="Menu_Hover"</xsl:attribute>
<xsl:attribute name="onmouseout">javascript: this.className="Menu_Blur"</xsl:attribute>
<tr>
<td nowrap="nowrap">
<a>
<xsl:attribute name="href"><xsl:value-of select="$Node/URL"/></xsl:attribute>
<xsl:attribute name="onclick">javascript: OppNode(<xsl:value-of select="$ImgID"/>,<xsl:value-of select="$ChildrenID"/>);return false;</xsl:attribute>
<xsl:value-of select="$Node/Text"/>
</a>
</td>
</tr>
</table>
</td>
</tr>
</xsl:template>
<!-- 显示指定的一个页面链接菜单 -->
<xsl:template name="ChildLinkPage">
<xsl:param name="Node"/>
<tr>
<td width="10">
<a>
<xsl:attribute name="href"><xsl:value-of select="$Node/URL"/></xsl:attribute>
<img src="Images/point.gif" border="0"/>
</a>
<xsl:text> </xsl:text>
</td>
<td width="50" nowrap="nowrap">
<table width="100%" border="0" cellspacing="0" cellpadding="2">
<xsl:attribute name="class">Menu_Blur</xsl:attribute>
<xsl:attribute name="onmouseover">javascript: this.className="Menu_Hover"</xsl:attribute>
<xsl:attribute name="onmouseout">javascript: this.className="Menu_Blur"</xsl:attribute>
<tr>
<td nowrap="nowrap">
<a>
<xsl:attribute name="href"><xsl:value-of select="$Node/URL"/></xsl:attribute>
<xsl:value-of select="$Node/Text"/>
</a>
</td>
</tr>
</table>
</td>
</tr>
</xsl:template>
</xsl:stylesheet>
|
[返回] 中文XML论坛 - 专业的XML技术讨论区 →
XML.ORG.CN讨论区 - XML技术 → 『 XSL/XSLT/XSL-FO/CSS 』 → 无限深度菜单代码共享
(订阅本版)
2004/12/1 13:30:00
新浪微博
