自动滚动到元素在HTML(Automatically scroll to Element in HT

我有一个包含测试数据的加载一个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>

Answer 1:

使用id属性。

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

然后，如果你重定向页面your_page.html#result1浏览器将滚动到这个表。

Answer 2:

您需要引入一些状态，从而使浏览器可以知道这是目前该测试。您可以通过几种不同的方式做到这一点：

网址

如果你能每次运行测试时的参数添加到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>

我给饼干一年的有效期，因为我不知道你在做有关会议，重新启动浏览器，等等......到去年的会议默认饼干什么，所以你也许能得逞的。

除了其中的一件事情，你也需要做什么@psur说，即一个ID添加到每个表，使浏览器可以滚动到它。我只想用数字表明：