在用户选择之外添加标签答案

【问题标题】：addings tags outside the user's selection在用户选择之外添加标签
【发布时间】：2011-12-01 16:48:05
【问题描述】：

我正在尝试创建一个非常原始的所见即所得编辑器。我进行了很多搜索，但没有成功找到一些可行的方法并回答我需要的东西。我发现有人的代码应该在选择周围添加标签，但它对我不起作用。你知道问题所在吗？我实际上需要找出是否有一些标签包裹了文本，如果是，我将能够更改它们，如果没有，我将添加一些标签。

非常感谢！

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html dir="rtl" xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>check</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<script type="text/javascript">
$("p").live("mouseup",function() {
selection = getSelectedText();
if(selection.length >= 3) {
    var spn = '<span style="background-color: yellow;">' + selection +     '</span>';
    $(this).text($(this).html().replace(selection, spn));
}
});

//Grab selected text
function getSelectedText(){
if(window.getSelection){
    return window.getSelection().toString();
}
else if(document.getSelection){
    return document.getSelection();
}
else if(document.selection){
    return document.selection.createRange().text;
}
}
</script>
</head>
<body>
<p> check check check </p>
</body>
</html>

【问题讨论】：

试试这个基本的演示，也许你可以使用一些：www-archive.mozilla.org/editor/midasdemo
为自己节省 500 小时的工作时间，只需下载它！ github.com/akzhan/jwysiwyg/downloads 。一个很棒的 jQuery WYSIWYG 编辑器

标签： jquery selection

【解决方案1】：

这里有一个指南，可以帮助您构建自己的所见即所得编辑器。可能会在那里找到有用的东西：链接Crete your own wysiwyg editor

【讨论】：