1

是否可以在 Javascript 的帮助下选择文本（就像用户将鼠标拖过浏览器中的 HTML 单词一样）？

我有一些 JS 代码在 HTML 表中搜索用户的字符串输入。然后，如果找到此词，我希望此代码选择/关注该词。

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)
    {
                //select word and focus on it in user's browser?
    }
}
4

3 回答 3

0

为了通过悬停突出显示元素，最简单的方法是使用 css。

例子：

你有html代码：

<p id="test">Word</p>

CSS 文件：

#word:hover{ color: #FFFF00; }

这将通过悬停元素为文本着色。

编辑，如果您有多个单词...您希望将它们分隔在每个单词的一个元素中。例如：

<text class="word">each</text><text class="word">word</text><text class="word">is</text><text class="word">selectable</text>  

.word:hover{ color: #FFFF00; }

这是 JS 小提琴：http: //jsfiddle.net/braTe/

于 2013-03-01T20:57:47.823 回答
0

看起来好像您想使用该Selection对象。在基本级别，您可以只设置其锚点和焦点节点和偏移量，或者您也可以创建多范围选择。

于 2013-03-01T21:02:39.013 回答
0

您可以用相同的字符串替换找到的字符串，但在特定类的范围内。

例如，如果搜索词是“alpha”：

<td>The alphabet is long.</td>
<td>The <span class="highlighted">alpha</span>bet is long.</td>

当搜索更改时，您必须将所有突出显示的跨度恢复为纯文本。

如果您想实际使用浏览器选择进行选择，这里讨论了一种有限的方法：Programmatically select text in a contenteditable HTML element?

于 2013-03-01T20:49:57.057 回答