0

我想弄清楚如何隐藏我的 xslt 样式表中的行。我创建了一个 XSLT 样式表,显示每一行可用......但我想拥有它,以便在加载 xml 时隐藏一些行。

这就是 xslt(xml 样式表)的样子。

<?xml version="1.0" encoding="ISO-8859-1"?>
    <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">

    <xsl:template match="/Catalogue">
     <html>
     <body>
        <xsl:for-each select="Tales">
        <xsl:if test="Talent != ''">
            <table border="0" width="550">
                <tr>
                    <td bgcolor="#A0A0A0" width="80%"><b><xsl:value-of select="Tale"/></b></td>
                    <td bgcolor="#A0A0A0" width="20%" align="center"><xsl:value-of select="Cost"/>
                    <xsl:text>  -  </xsl:text>
                    <xsl:value-of select="Type"/></td>
                 </tr>
                <tr>
                <xsl:if test="Prereq != ''">
                    <td colspan="2" bgcolor="#C0C0C0"><xsl:value-of select="Prereq"/></td>
                </xsl:if>   
                </tr>
                <tr>
                <xsl:if test="Action != ''">
                    <td colspan="2" bgcolor="#E0E0E0"><xsl:value-of select="Action"/></td>
                </xsl:if>
                </tr>
                <tr>
                <xsl:if test="Description != ''">
                    <td colspan="2" bgcolor="#EBEBEB"><xsl:value-of select="Description"/></td>
                </xsl:if>
                </tr>
            </table>
               <br/>  <br/>
        </xsl:if>
     </xsl:for-each>
     </body>
     </html>
    </xsl:template>
    </xsl:stylesheet>

我想知道如何在页面打开时隐藏包含 Prereq、Action 和 description 的表格行,然后通过按下按钮或 + 链接来显示这些行。然后如果再次单击隐藏。

我已经看到一些教程显示正在使用 javascript 完成,但是一旦我尝试添加此代码,xml 数据就不再显示。

任何帮助将不胜感激。

更新:这就是 xml 的样子

<?xml version="1.0"?>
    <?xml-stylesheet href="bloodandguts.xsl" type="text/xsl"?>
<Catalogue>
<Tales>
<Talent>Training</Talent>
<Cost>1</Cost>
<Type>Any</Type>
<Prereq></Prereq>
<Action>Passive</Action>
<Description>Confers proficiency of a single type of training</Description>
</Tales>
// then lots more <Tales></Tales>
</Catalogue>

更新:

这就是我添加到我的 xslt 中的方式......但由于某种原因它阻止我的 xml 文件显示任何内容

<?xml version="1.0" encoding="ISO-8859-1"?>
    <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
    <script type ="text/javascript" src="jquery.js" ></script>
    <xsl:template match="/Catalogue">
     <html>
     <body>
4

1 回答 1

1

只是为了给您一些帮助以继续,或澄清您的问题。

在您的示例中添加一些 javascript 应该没问题。例如,我使用 jQuery,即使对于这样一个简单的示例来说没有必要。

  • <header>如有必要,在 html 中添加 javascript 库:

           <script type ="text/javascript" src="jquery.js" ></script>
    
  • 将 id 或类添加到您想要隐藏并稍后显示的行中。

    <tr id="test1" style="display:none">
    
  • 将 onclick 处理程序添加到标题行。

    <td bgcolor="#A0A0A0" width="80%">
        <div onclick="$('#test1').show()">+</div>
        <b>
            <xsl:value-of select="Tale"/>
        </b>
    </td>
    

请注意,这仅显示如何将 javascript (jquery) 添加到您的示例中。这只会显示一个隐藏的行,并且只适用于一个 <Tales>条目,因为 html 中的 id 应该是唯一的。因此,您可以从 xslt 创建唯一 id,也可以将一个类添加到您的动态行并从您的 javascript 处理程序中搜索它们。

更新:

<?xml version="1.0" encoding="iso-8859-1"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
    <xsl:template match="/Catalogue">
        <html>
            <header>
            <script type ="text/javascript" src="jquery.js" ></script>
            </header>
            <body>
                <xsl:for-each select="Tales">
                    <xsl:if test="Talent != ''">
                        <table border="0" width="550">
                            <tr>
        <td bgcolor="#A0A0A0" width="80%">
            <div onclick="$('#test1').show()">+</div>
            <b>
                <xsl:value-of select="Tale"/>
            </b>
        </td>
                                <td bgcolor="#A0A0A0" width="20%" align="center">
                                    <xsl:value-of select="Cost"/>
                                    <xsl:text>  -  </xsl:text>
                                    <xsl:value-of select="Type"/>
                                </td>
                            </tr>
                            <tr >
                                <xsl:if test="Prereq != ''">
                                    <td colspan="2" bgcolor="#C0C0C0">
                                        <xsl:value-of select="Prereq"/>
                                    </td>
                                </xsl:if>
                            </tr>
                            <tr id="test1" style="display:none">
                                <xsl:if test="Action != ''">
                                    <td colspan="2" bgcolor="#E0E0E0">
                                        <xsl:value-of select="Action"/>
                                    </td>
                                </xsl:if>
                            </tr>
                            <tr>
                                <xsl:if test="Description != ''">
                                    <td colspan="2" bgcolor="#EBEBEB">
                                        <xsl:value-of select="Description"/>
                                    </td>
                                </xsl:if>
                            </tr>
                        </table>
                        <br/>
                        <br/>
                    </xsl:if>
                </xsl:for-each>
            </body>
        </html>
    </xsl:template>
</xsl:stylesheet>
于 2013-04-21T09:32:27.930 回答