如何专注于 HTML 表格中的行？答案

【问题标题】：How to focus on row in HTML Table?如何专注于 HTML 表格中的行？
【发布时间】：2013-02-18 20:04:03
【问题描述】：

是否可以在 Javascript 的帮助下专注于特定的 HTML 表格行/单元格？例如，如果该行位于浏览器折叠之后，则浏览器将向下滚动到焦点所在的行。

我有一些 JS 代码在 HTML 表中搜索用户的字符串输入。然后，如果找到该词（Safari/Chrome 浏览器），我希望此代码专注于该词。

var targetTable = document.getElementById("accountTable");

for (var rowIndex = 1 + searchStart; rowIndex < targetTable.rows.length; rowIndex++)
{
    var rowData = '';
    rowData = targetTable.rows.item(rowIndex).cells.item(0).textContent;
    if (rowData.indexOf(str) != -1)
    {
                //focus on the row?
    }
}

【问题讨论】：

专注？表单域获得焦点。表格行没有。是否意味着以某种方式突出显示？
假设它是一个巨大的表格，我基本上希望浏览器向下滚动到该行。
好的。你使用 jquery 或任何类似的库吗？
如果你不关心动画，你可以使用 scrollTo(x, y)。如果你想要一个漂亮的动画并且使用 jquery，你可以使用 jQuery 的 scrollTo。如果你想要一个动画并且不使用 jQuery，你可以参考这个线程：stackoverflow.com/questions/8917921/…

标签： javascript html google-chrome web safari

【解决方案1】：

您可以为每一行提供一个与内容匹配的 HTML ID（动态或静态取决于您的需要），然后使用 URI 片段来关注它。您基本上可以使用您当前的代码并使用

location.hash = rowData;

如果内容与用户输入匹配。如果您想要关注的行中有整个句子，这当然会很麻烦，但对于一个简单的表格，它会起作用。

【讨论】：

【解决方案2】：

我可以通过使用scrollIntoView() 来实现这一点。

【讨论】：