Question

我的xml如下：

     <?xml version="1.0" encoding="UTF-8"?>
      <product>
         <auto>
            <admin>
                <date>01/01/2015</date>
            </admin>
            <report>
                 <Fname>John</Fname>
                 <Lname>ABC</Lname>
            </report>
        </auto>
        <auto>
             <admin>
                 <date>02/02/2015</date>
             </admin>
             <report>
                 <Fname>Tim</Fname>
                 <Lname>DEF</Lname>
             </report>
        </auto>
    </product>

我的XSLT如下：

    <?xml version="1.0" encoding="UTF-8"?>
     <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
     <xsl:template match="/">
      <html lang="en">
      <head>
           <title>Example</title>
           <script type="text/javascript"> function toggleDisplay(element) { element.style.display = element.style.display === 'none' ? '' : 'none'; }       </script>
  </head>
  <body>
    <h1>Example</h1>
    <xsl:apply-templates/>
  </body>
  </html>
 </xsl:template>
  <xsl:template match="product/auto">
<ul>
  <a onclick="toggleDisplay(this.parentNode.getElementsByTagName('ul')[0]); return false;" href="#">
    <xsl:value-of select="report/Fname"/>
  </a>
  <xsl:apply-templates select="admin"/>
  <xsl:apply-templates select="report"/>
</ul>
  </xsl:template>
  <xsl:template match="admin">
   <ul style="display:none;">
  <li>
    Admin: <xsl:value-of select="date"/>
    <br/>
  </li>
</ul>
  </xsl:template>
  <xsl:template match="report">
   <ul style="display:none;">
  Report: <xsl:value-of select="Lname"/>
  <br />
  </ul>
   </xsl:template>
  </xsl:stylesheet>

我正在尝试输出如下：

在加载Html时，只有Fname会显示为

  John
  Tim
两者都有开放孩子的链接 onclick on John，只有Admin显示如下
 John
     Admin: 01/01/2015

报告：ABC没有显示。

预期

  John
       Admin:01/01/2015
       Report:ABC

如果我删除了该事件并显示：无，则显示管理员和报告。

我在这里做错了什么。

请在这里帮助我。

Answer 1

这比XSL更像是一个javascript问题。您只需要“切换显示”所有相关的<ul>元素，而不仅仅是第一个元素 - 索引0处的元素：

<a onclick="toggleDisplayAll(this.parentNode.getElementsByTagName('ul')); return false;" href="#">
    <xsl:value-of select="report/Fname"/>
</a>

并适应在JS函数定义中切换多个元素。这是本答案中唯一的XML / XSL，您可以在CDATA元素中包含JS代码，只是为了方便（避免必须转义<，>等XML特殊字符，特别是当功能变得越来越复杂时）：

<script type="text/javascript">
  <![CDATA[
    function toggleDisplay(element) 
    { 
        element.style.display = element.style.display === 'none' ? '' : 'none'; 
    };
    function toggleDisplayAll(elements) 
    { 
        for(var i=0; i<elements.length; i++){
            toggleDisplay(elements[i]);
        }
    }   
  ]]>
</script>

XSLT无法使用display：none

1 个答案: