Question

如何使用Javascript获取选择的[开始，结束]点？

我希望将其保存在数据库中，以便将来突出显示相同的文字。

是相对于父节点还是整个文档的选择？

Answer 1

获取文字并不容易＃34;当然HTML格式化＆＃34;寻找并在未来突出它。

从我的观点来看，最好的方法应该是这样的：

从用户输入中获取所选文本的[开始，结束]点（在js中它只是一个整数）并保存它。然后你可以通过普通的js或jquery插件突出显示它或在它周围制作矩形（将开始和结束点发送到文本突出显示功能）。不要忘记所有这些工作都能正常工作，而格式化的HTML没有改变！

我过去喜欢你的项目，所以我喜欢这样：

$(document).ready(function(){

$(document.body).bind('mouseup', function(e){
        var selection;

        if (window.getSelection) {
          selection = window.getSelection();
        } else if (document.selection) {
          selection = document.selection.createRange();
        }

        selection.toString() !== '' && alertSelection(selection.toString(),e.pageX, e.pageY);
//e.pageX + '/' + e.pageY

    });

function getSelectionCharOffsetsWithin(element) {
    var start = 0, end = 0;
    var sel, range, priorRange;
    if (typeof window.getSelection != "undefined") {
        range = window.getSelection().getRangeAt(0);
        priorRange = range.cloneRange();
        priorRange.selectNodeContents(element);
        priorRange.setEnd(range.startContainer, range.startOffset);
        start = priorRange.toString().length;
        end = start + range.toString().length;
    } else if (typeof document.selection != "undefined" &&
            (sel = document.selection).type != "Control") {
        range = sel.createRange();
        priorRange = document.body.createTextRange();
        priorRange.moveToElementText(element);
        priorRange.setEndPoint("EndToStart", range);
        start = priorRange.text.length;
        end = start + range.text.length;
    }
    return {
        start: start,
        end: end
    };
}


function alertSelection(text,x,y) {
    var mainDiv = document.getElementById("article");
    var sel = getSelectionCharOffsetsWithin(mainDiv);
alert(sel.start + ": " + sel.end + ' ' + text);
}

});

使用bit jquery是一个完整的解决方案，希望它会有所帮助：）

Answer 2

首先，你应该尝试使用PRE标签，这样你就不必为段落做BR。

其次，你必须得到选择。为此，我建议使用Rangy JS库。有了它，您可以通过以下方式获得范围：

var selection = rangy.getSelection();
var sel_start = selection.anchorOffset;
var sel_end = selection.focusOffset;

然后，您可以在位置的文本中插入格式化程序元素。

用户选择 - 获取参考以供将来使用

2 个答案: