通过按钮切换表格元素HTML的可见性

Question

我正在编写一个XSL文件，该文件将一段XML转换为HTML，其中包含一小段JavaScript代码，我可以通过单击按钮来切换表格元素HTML的可见性。 我现在不需要使用样式。

这是我的XML：

<?xml version="1.0" encoding="ISO-8859-1"?>
<?xml-stylesheet type='text/xsl' href='myXSL.xsl'?>
<LISTS>
  <SCR>repository</SCR>
  <Dependency><ArtifactId>maven</ArtifactId>
  <GroupId>NO</GroupId>
  <!--two tags details appear only if the 'GroupId' node value  is 'NO'-->
  <detail1>
    Here is a text detail 1
  </detail1>
  <detail2>
    Here is a text detail 2
  </detail2>
  </Dependency>
  <Dependency>
    <ArtifactId>eclipse</ArtifactId>
  <GroupId>YES</GroupId></Dependency>
</LISTS>

我的XSL是：

<xsl:template match = "/">
 <html>
   <head>
    <script type="text/javascript">

    function toggle(p1,p2)
    {
      if(document.all){document.getElementById(p1).style.display =
   document.getElementById(p1).style.display == "block" ? "none" : "block";}
      else{document.getElementById(p1).style.display =  
   document.getElementById(p1).style.display == "table" ? "none" : "table";}
      document.getElementById(p2).value =  
   document.getElementById(p2).value == "[-] Detruire" ? "[+] Construire" : "[-] Detruire";
     }

    </script>

   </head>

     <BODY>
        <table>
            <xsl:for-each select="LISTS/Dependency">
                <xsl:call-template name="myTemplate"/>      
            </xsl:for-each>  
        </table>
     </BODY>
 </html>
 </xsl:template>

<!-- called template-->

<xsl:template name="myTemplate">
<tr>        
     <xsl:choose>
        <xsl:when test="GroupId='YES'">
         <tr>
             <td><xsl:value-of select="ArtifactId"/></td>
             <td>OK</td>
        </tr>
         </xsl:when>

        <xsl:when test="GroupId='NO'">
        <tr>
             <td><xsl:value-of select="ArtifactId"/></td>

            <td align="right">KO<input id="mylnk" type="button"  
   value="[+] Construire" onclick="toggle('tb','mylnk');"/></td>
         </tr>
        <tr>
            <td> 
                <table width="100%" border="1" cellpadding="4" 
    cellspacing="0" id="tb" name="tb">
                  <tr>                   
                    <td><xsl:value-of select="detail1"/></td>
                    <td><xsl:value-of select="detail2"/></td>
                 </tr>     
                 </table>
            </td> 
        </tr>              
        </xsl:when>

    </xsl:choose>
</tr>
</xsl:template>

</xsl:stylesheet>

我使用XSL获得的结果如下：

在此处输入图片说明

如何更改我的XSL以使其默认为该代码？

![enter image description here][2]

当扩展时，得到这个吗？

![enter image description here][3]

Answer 1

如果您的要求是默认情况下使表格在页面加载时折叠起来，则将以下内容添加到表格标签中（ID = tb）：

style="display:none;"

Answer 2

function visibility(tbid,lnkid)
{

   document.getElementById(tbid).style.display =(document.getElementById(tbid).style.display == "block") ? "none" : "block";
   document.getElementById(lnkid).value =(document.getElementById(lnkid).value == "[-] Collapse") ? "[+] Expand" : "[-] Collapse";
 }

</script>


<table width="100%" id="tb" name="tb" style="display:block">

还给出格式...

getElementById("+tbid+")

尝试一下

通过按钮切换表格元素HTML的可见性

问题描述

2 个解决方案

解决方案1
0 已采纳 2013-07-25 11:06:35

解决方案2
0

通过按钮切换表格元素HTML的可见性

问题描述

2 个解决方案

解决方案1 0 已采纳 2013-07-25 11:06:35

解决方案2 0

解决方案1
0 已采纳 2013-07-25 11:06:35

解决方案2
0