活动和XSLT

-3

我写了XML，XSD和XSL文件，我想知道如何做到以下几点：活动和XSLT

如果用户点击某个链接时，页面会显示一定的段落。如果用户点击不同的链接，页面将显示不同的段落。这怎么可能？谢谢。

编辑：

这是代码。这个想法是，如果我点击表格中的国家/地区名称，我会显示有关该国家的信息，如果我点击另一个国家，它会显示那个国家。信息将在ws：CountryName/ws：Information中，并且会有文字和图片。

XSL：

<?xml version="1.0" encoding="UTF-8"?> 
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" 
       xmlns:ws="http://www.w3schools.com" 
       version="1.0"> 

<xsl:template match="/"> 
<html> 
<body> 
<table border="1"> 
<tr bgcolor="red"><th>Country</th></tr> 

<xsl:for-each select="ws:Categorie/ws:Countries/ws:Country"> 
     <tr><td><xsl:value-of select="ws:CountryName"/></td></tr> 
</xsl:for-each> 

</table> 
</body> 
</html> 
</xsl:template> 

</xsl:stylesheet>

来源

2012-04-21 John

XML，XSD和XSL与用户交互无关。所以请提供一些关于环境和上下文的更多信息。你在说什么“页面”？ – 2012-04-21 15:30:47

好的我已经添加了这些信息，我希望它能让它更容易理解 – John 2012-04-21 15:42:26

听起来像是你想有隐藏/显示文本链接到各自的国家。做到这一点的最佳方式是添加链接到国家/地区值，点击时会运行JavaScript来切换隐藏/显示。
例如：

<?xml version="1.0" encoding="UTF-8"?> 
<xsl:stylesheet 
    xmlns:xsl="http://www.w3.org/1999/XSL/Transform" 
    xmlns:ws="http://www.w3schools.com" 
    version="1.0"> 
    <xsl:template match="/"> 
     <html> 
      <head> 
       <title>Trial country links</title> 
       <script> 
        function hideShow(country){ 
         if(document.getElementById(country).style.display == 'none'){ 
          document.getElementById(country).style.display = 'block'; 
         } else { 
          document.getElementById(country).style.display = 'none'; 
         } 
        } 
       </script> 
      </head> 
      <body> 
       <table border="1"> 
        <tr bgcolor="red"> 
         <th>Country</th> 
         <th>Information</th> 
        </tr> 
        <xsl:for-each select="//ws:Categorie/ws:Countries/ws:Country"> 
         <tr> 
          <td> 
           <xsl:element name="a"> 
            <xsl:attribute name="href">javascript:hideShow('<xsl:value-of select="ws:CountryName"/>')</xsl:attribute> 
            <xsl:value-of select="ws:CountryName"/> 
           </xsl:element> 
          </td> 
          <td> 
           <xsl:element name="div"> 
            <xsl:attribute name="id"><xsl:value-of select="ws:CountryName"/></xsl:attribute> 
            <xsl:attribute name="style">display:none;</xsl:attribute> 
            <xsl:value-of select="ws:Information"/> 
           </xsl:element> 
          </td> 
         </tr> 
        </xsl:for-each> 
       </table> 
      </body> 
     </html> 
    </xsl:template> 
</xsl:stylesheet>

当施加到随后的输入XML

<?xml version="1.0" encoding="UTF-8"?> 
<ws:Categorie xmlns:ws="http://www.w3schools.com"> 
    <ws:Countries> 
     <ws:Country> 
      <ws:CountryName>Birma</ws:CountryName> 
      <ws:Information>Birma blabla</ws:Information> 
     </ws:Country> 
     <ws:Country> 
      <ws:CountryName>India</ws:CountryName> 
      <ws:Information>India blabla</ws:Information> 
     </ws:Country> 
     <ws:Country> 
      <ws:CountryName>Boerkina Faso</ws:CountryName> 
      <ws:Information>Boerkina Faso blabla</ws:Information> 
     </ws:Country> 
     <ws:Country> 
      <ws:CountryName>Namibia</ws:CountryName> 
      <ws:Information>Namibia blabla</ws:Information> 
     </ws:Country> 
    </ws:Countries> 
</ws:Categorie>

这给出

<html> 
    <head> 
     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
     <title>Trial country links</title> 
     <script> 
        function hideShow(country){ 
         if(document.getElementById(country).style.display == 'none'){ 
          document.getElementById(country).style.display = 'block'; 
         } else { 
          document.getElementById(country).style.display = 'none'; 
         } 
        } 
       </script> 
    </head> 
    <body> 
     <table border="1"> 
      <tr bgcolor="red"> 
       <th>Country</th> 
       <th>Information</th> 
      </tr> 
      <tr> 
       <td><a href="javascript:hideShow('Birma')">Birma</a></td> 
       <td> 
        <div id="Birma" style="display:none;">Birma blabla</div> 
       </td> 
      </tr> 
      <tr> 
       <td><a href="javascript:hideShow('India')">India</a></td> 
       <td> 
        <div id="India" style="display:none;">India blabla</div> 
       </td> 
      </tr> 
      <tr> 
       <td><a href="javascript:hideShow('Boerkina Faso')">Boerkina Faso</a></td> 
       <td> 
        <div id="Boerkina Faso" style="display:none;">Boerkina Faso blabla</div> 
       </td> 
      </tr> 
      <tr> 
       <td><a href="javascript:hideShow('Namibia')">Namibia</a></td> 
       <td> 
        <div id="Namibia" style="display:none;">Namibia blabla</div> 
       </td> 
      </tr> 
     </table> 
    </body> 
</html>

来源

2012-04-22 10:59:37 Maestro13

有XSLT这也支持事件，如Saxon-CE的纯JS实现。可能想给他们一个尝试。实际上，他们自己的documentation是使用它来实现的，并且完全符合你想要达到的目标，所以你可能想研究它。

来源

2014-03-30 07:05:31 DanMan

回答

相关问题