自动滚动到HTML格式的元素

时间:2013-05-14 10:59:42

标签: java html xml xslt

我有一个包含大量测试数据的XML。我使用XSLT在浏览器中以HTML格式显示此数据。每个测试都有一个包含Teststeps的表。每次运行测试时,如果传递,表都会更新表中的数据。然后浏览器重新加载页面。我希望它总能跳到它正在处理的表格上。我怎样才能做到这一点?我的XSLT文件:

<?xml version="1.0"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">

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


    var testnum = 0;
     if(document.cookie.indexOf('testnum=') !== -1) {

     testnum = document.cookie.split('testnum=')[1].split(';')[0];

    document.cookie = 'testnum=' + testnum + 1 + ';expires=Sat, 14 May 2015 18:00:00      GMT";';
   } else {

      document.cookie = 'testnum=1;expires=Sat, 14 May 2015 18:00:00 GMT";';
   }

var w = $(window);
var row = $('#test').find('tr').eq( testnum );

if (row.length){
    w.scrollTop( row.offset().top - (w.height()/2) );
}

</script>

  <title>HMI Automotive Testing</title>
  <link rel="stylesheet" type="text/css" href="report.css" />

  </head>

  <body>

    <center>
    <h1>HMI Automotive Testing</h1>

      <br></br>
      <div style="height:650px;width:824px;border:1px solid;overflow:auto;">

            <table border="1" id ="test">
            <xsl:for-each select= "TestSuite/TestCase">

                        <tr>
                        <b><xsl:value-of select="@name"/></b>

                        </tr>

                        <xsl:for-each select="Verification|Command">
                                <tr>
                                <xsl:choose>
                                        <xsl:when test="contains(name() , 'Verification')">

                                        <td>Verification <xsl:value-of select="@type"/></td>
                                        <td><xsl:value-of select="@status"/></td>
                                </xsl:when>
                                <xsl:when  test="contains(name() , 'Command')">
                                        <td>Command <xsl:value-of select="@type"/></td>
                                        <td><xsl:value-of select="@status"/></td>
                                </xsl:when>
                                </xsl:choose>

                                </tr>


                        </xsl:for-each>

              </xsl:for-each>
              </table>  
            </div>
      </center>



  </body>
  </html>

</xsl:template>

</xsl:stylesheet> 

2 个答案:

答案 0 :(得分:0)

使用id属性。

<table id="result1">
...
</table>

然后,如果您将页面重定向到your_page.html#result1浏览器,则会滚动到此表格。

答案 1 :(得分:0)

您需要引入一些状态,以便浏览器可以知道当前正在进行的测试。您可以通过几种不同的方式完成此任务:

URL

如果您可以在每次运行测试时向URL添加参数,那么您应该执行@psur所说的内容。

缓存

使用Cookie存储当前的测试编号。

当XSLT输出HTML页面时,让它在顶部输出一些js。这需要检查cookie的存在,并在每次加载页面时递增它的值,然后滚动到HTML中的该位置。像这样:

<script type="text/javascript">
//<![CDATA[

var testnum = 0;
if(document.cookie.indexOf('testnum=') !== -1) {
    // Cookie already exists, this isn't the first test, read the testnum
    testnum = document.cookie.split('testnum=')[1].split(';')[0];
    // write to next testnum back to the cookie for next time.
    document.cookie = 'testnum=' + testnum + 1 + ';expires=Sat, 14 May 2015 18:00:00 GMT";';
} else {
    // No cookie, must be first test
    document.cookie = 'testnum=1;expires=Sat, 14 May 2015 18:00:00 GMT";';
}
// scroll to the correct test table
location.hash = '#' + testnum;

//]]>
</script>

我已经给了cookie一年到期,因为我不知道你在会话,浏览器重启等方面做了什么......默认情况下,cookie会在会话中持续,所以你可能会离开那个。


除了其中一项,你需要做@psur所说的,即为每个表添加一个id,以便浏览器可以滚动到它。我建议只使用数字:

<table id="1">
...
</table>