0

我现在正在切换表格行，但是只有第一个条目是可点击的，当点击它时，我所有表格中的每一行都被隐藏了..

我需要一些帮助来弄清楚如何制作它，以便在单击每个表格的文本时只影响表格行。不是循环中的每个表。

这就是我的代码的样子

<?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>
        <script>
            $(function() {
            $('#toggle').click(function() {
            $('td:nth-last-child(-n + 1):nth-child(3n + 1)').toggle();                
       });
    });
    </script>


    </header>
     <body>
        <xsl:for-each select="Talents">
        <xsl:if test="Talent != ''">
            <table border="0" width="550">
                <tr>
                    <td bgcolor="#A0A0A0" width="80%">

                    <b id="toggle"><xsl:value-of select="Talent"/></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>

                <xsl:if test="Prerequisite != ''">
                <tr>
                    <td colspan="2" bgcolor="#C0C0C0"><xsl:value-of select="Prerequisite"/></td>
                    </tr>
                </xsl:if>   

                <xsl:if test="Action != ''">
                <tr id="rowToClick" style="display:none">
                    <td colspan="2" bgcolor="#E0E0E0"><xsl:value-of select="Action"/></td>
                    </tr>
                </xsl:if>

                <xsl:if test="Description != ''">
                <tr>
                    <td colspan="2" bgcolor="#EBEBEB"><xsl:value-of select="Description"/></td>
                    </tr>
                </xsl:if>

            </table>
        </xsl:if>
     </xsl:for-each>
     </body>
     </html>
    </xsl:template>
    </xsl:stylesheet>

任何帮助将不胜感激。

4

1 回答 1

1

使用以下功能：

$(function() {
        $('table tr b').click(function() {
            $(this).parent().parent().toggle();                
   });
});

注意：这将为行内的每个 b-tag 添加一个处理程序。单击该标签后，父行将被切换。

但是，我不明白您为什么希望它切换。由于第一次隐藏，您无法再次切换它（它已隐藏，因此无法再点击）

EDIT OP 希望表的第一行切换其余行：

$(function() {
            $('table tr').not(":first-child").hide();  // hides the other rows on page load
            $('table tr:first-child').click(function() {
                $(this).siblings().toggle();                
       });
    });

反映在这个小提琴中：http: //jsfiddle.net/Kennethtruyers/g52xk/6/

于 2013-04-21T11:17:23.150 回答