使用XSLT中的循环显示选项卡中的内容

Question

我正在尝试使用XSLT显示数据。我想要的是在不同的选项卡中显示不同的子类别。例如：主要类别是车辆，子类别是汽车，公共汽车等。我想在tab1中使用汽车，在tab2中使用总线等等。我希望汽车标签和内容是活跃的。到目前为止，我有汽车选项卡，然后显示内容和下面的内容显示选项卡中的总线，内容和下面是另一个选项卡和内容。我知道它与JavaScript有关，并不是很好。如果有人有任何建议，我感谢您的帮助。

        <div id="subcat-carousel-wrapper">

                <ul class="tabs">
                  <xsl:for-each select="childCategories/category">
                    <li id="tab1" class="active">
                      <a href="#tab1">
                        <h2>
                          <xsl:value-of select="properties/property[@name='DisplayName']"/>
                        </h2>
                      </a>
                    </li>
                    <div class="tab-content">
                      <a class="series-name" style="display:none">
                        <xsl:value-of select="properties/property[@name='Id']"/>
                      </a>
                      <xsl:variable name="subcatPages" select="ceiling(count(childProducts/product) div 4)"/>
                      <div class="carousel-mask" >
                        <div class="productsDiv" runat="server">

                          <xsl:for-each select="childProducts/product">
                            <xsl:if test="position() mod 4 = 0">
                              <div class="subcat-carousel-product-box">
                                <a class="subcat-links">
                                  <xsl:attribute name="href">
                                    <xsl:variable name="productId" select="properties/property[@name='Id']"/>
                                    <xsl:value-of select="concat('../Pages/ProductDetails.aspx?pid=', $productId)"/>
                                  </xsl:attribute>
                                  <div class="subcat-thumbnail">
                                    <xsl:if test="Images/category/childProducts/product/properties/property[@name='Gallery_thumbnail']">
                                      <xsl:variable name="imageUrl" select="Images/category/childProducts/product/properties/property[@name='Gallery_thumbnail']"/>
                                      <img class="carouselThumb">
                                        <xsl:attribute name="src">
                                          <xsl:value-of select="concat($MediaUrl, $imageUrl)"/>
                                        </xsl:attribute>
                                        <xsl:attribute name="title">
                                          <xsl:value-of select="properties/property[@name='DisplayName']"/>
                                        </xsl:attribute>
                                        <xsl:attribute name="alt">
                                          <xsl:value-of select="properties/property[@name='DisplayName']"/>
                                        </xsl:attribute>
                                      </img>
                                    </xsl:if>
                                  </div>
                                  <h2>
                                    <xsl:value-of select="properties/property[@name='DisplayName']"/>
                                  </h2>
</xsl:for each>
</ul>

谢谢