在HTML文本框中扩展JS范围/选择

Question

给定用户在其中进行选择的文本框，我希望能够使用JS扩展选择（通过单词或字符）。

我知道在某些浏览器中，我可以使用window.getSelection(); （请参阅此处 ）以获取当前选择，在FireFox中，您可以使用selection.modify("extend", "forward", "word"); IE也支持 TextRange对象。

这是一项要求，因为我需要检查选择并将其与之前和之后的文本进行比较（因此，很显然，完成后我将重置选择）。

我需要支持IE9（虽然也许我可以摆脱IE10），Chrome和FF，但我拥有JQuery，但可以使用任何第三方JS库。

本文很有趣，但不是很想要： Webkit中的选择范围（Safari / Chrome）

Answer 1

Textareas具有自己的选择API，该API与页面或可contenteditable元素中的常规选择的API不同。 这很简单：一个textarea具有可读和可写的selectionStart和selectionEnd属性，它们分别表示在textarea值内的选择开始和结束位置。 IE <= 8具有与此不同的API，但IE 9支持它。

您没有得到相当于Selection.modify()但是您可能仍然不需要它，因为它通常很容易使用textarea的值。

MDN： https ： //developer.mozilla.org/en-US/docs/Web/API/HTMLTextAreaElement

Answer 2

您可以通过以下方式更改活动选择：

var selection = window.getSelection();
var range = selection.getRangeAt(0);
range.setStart(range.startContainer, 0); // set to the beginning
selection.setSingleRange(range);

修改范围不会更新UI，您必须设置范围。