锚在桌子上

Question

我有一个长表，我希望客户端在加载页面时滚动到给定的行。我做了一个jsFiddle：

https://jsfiddle.net/s28hf39e/2/

td {
  height: 200px
}

table,
th,
td {
  border: 1px solid black;
}

<a href="#row-1">Link to row 1</a>
<a href="#row-2">Link to row 2</a>
<a href="#row-3">Link to row 3</a>
<a href="#row-4">Link to row 4</a>
<table>
  <tr>
    <td>
      <a id="row-1"></a>Row 1</td>
  </tr>
  <tr>
    <td>
      <a id="row-2"></a>Row 2</td>
  </tr>
  <tr>
    <td>
      <a id="row-3"></a>Row 3</td>
  </tr>
  <tr>
    <td>
      <a id="row-4"></a>Row 4</td>
  </tr>
</table>

链接正常工作，但在调用http://my.url/#row-4时页面不会滚动到预期的行

滚动到页面加载时的预期行，我错过了什么？

Answer 1

你有这样的东西：

<a href="#row-1">Link to row 1</a>
<a href="#row-2">Link to row 2</a>
<a href="#row-3">Link to row 3</a>
<a href="#row-4">Link to row 4</a>
<table>
 <tr id="row-1"><td>Row 1</td></tr>
 <tr id="row-2"><td>Row 2</td></tr>
 <tr id="row-3"><td>Row 3</td></tr>
 <tr id="row-4"><td>Row 4</td></tr>  
</table>