使用 javascript/jquery 将突出显示的文本包含在带有强标签的文本区域中

Question

我正在寻找创建一个 javascript/jquery 函数来将文本区域中的一段突出显示的文本包装在强标签中 - 类似于此处的所见即所得编辑器。

这可能吗？如果可以，你能给我指出正确的方向吗？

编辑：

好的，希望这里是我想要的更清晰的描述...

我的页面上有一个可以输入的文本框。

然后我希望能够突出显示该文本的一部分，并且将突出显示的部分包裹在 标签中

因此，如果文本框包含单词 one 二三 并且我突出显示了单词“two”，我希望能够将该词包含在强标签中 - 因此成为 one two三

希望这更清楚...我知道有插件，但我不需要完整的所见即所得功能。

Answer 1

我的 Rangy input（我知道这个名字很糟糕）jQuery 插件就是这样做的。

示例代码：

$("#foo").surroundSelectedText("<strong>", "</strong>");

jsFiddle：http://jsfiddle.net/aGJDa/

Answer 2

我爱兰吉！经常使用它！但我不想只为这个小应用程序包含整个内容，所以我使用 document.execCommand 来包装选定的文本，然后使用 href（CreateLink execCommand 的第三个参数）来查找元素，将其包装与我想要的，然后删除链接：

    document.execCommand('CreateLink', false, 'uniqueid');
    var sel = $('a[href="uniqueid"]');
    sel.wrap('<strong />')
    sel.contents().unwrap();

document.execCommand 受所有主要浏览器支持，因此您应该可以安全地以这种方式破解它。在我测试过的浏览器中，浏览器本身会为您关闭和打开标签，因此，如果您从一个 html 标签的中间选择到另一个 html 标签的中间，它应该正确嵌套标签。