javascript中选择的位置 [英] Position of selection in javascript

问题描述

我试图在 div 中找到所选文本的位置.我提示用户在 div 中选择文本的子字符串，然后提交它.我需要起点和终点的索引，但使用下面的策略没有成功.任何帮助将非常感激.

I am trying to find the position of the selected text in a div. I prompt the user to select a substring of the text in a div and then submit it. I need the index of the start point and end point and have not been successful using the strategy below. Any help would be much appreciated.

这是我拥有的功能，但它不起作用:

This is the function I have and it is not working:

if (typeof window.getSelection != 'undefined') {                                                                                                                                                                                                                            
var sel = window.getSelection();                                                                                                                                                                                                                                          
var range = sel.getRangeAt(0);                                                                                                                                                                                                                                               
var preCaretRange = range.cloneRange();                                                                                                                                                                                                                               
startOffset = preCaretRange.toString().length;                                                                                                                                                                                                                        
endOffset = startOffset + range.toString().length;
}     

div 被称为myarea".谢谢

The div is called "myarea". Thanks

推荐答案

你几乎做对了！
它的 startOffset 导致它无法工作.
目前是:

You almost got it right!
Its the startOffset which is causing it not to work.
Currently it is:

var startOffset = preCaretRange.toString().length;

RHS 上的值 preCaretRange.toString().length 将返回已选择的字符串的总长度，不是开始位置.要获取起始位置，您可以使用 by 存储范围的 startOffset 属性.因此:

The value on the RHS which is preCaretRange.toString().length is going to return you the total length of the string which has been selected, and not the start position. To get the start position you would use the startOffset property stored by the range. Therefore:

var startOffset = preCaretRange.startOffset;

优化注意事项:您不需要将 range 克隆到 preCaretRange..

A note on optimization: you do not need to clone range into preCaretRange..

document.body.addEventListener('mouseup', function () {
    if (typeof window.getSelection != 'undefined') {
        var sel = window.getSelection();
        var range = sel.getRangeAt(0);

        var startOffset = range.startOffset;
        var endOffset = startOffset + range.toString().length - 1;

        console.log("Selection starts at: " + startOffset);
        console.log("Selection ends at: " + endOffset);
    }
}, false);

这是一个演示它使用实际文本选择的小提琴:http://jsfiddle.net/Dp3qp/3/

Here is a fiddle which demonstrates it working with an actual text selection: http://jsfiddle.net/Dp3qp/3/

这篇关于javascript中选择的位置的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！