My requirement is to get the start and end character index of the text selected by the user with respect to the main div, lets say "content" div. See sample code below. But when I select the "Rich" word in the web view. Its start and end character index es respective to the where the "span" tag i.e. 1 and 5, respectively. Whereas it should be 12 and 16 w.r.t "content" div.
<html>
<body>
<div id="content" contenteditable="true" style="font-family: Times New Roman; color: #fff; font-size: 18;">
This is <span style="background-color: yellow;">out</span> Rich Text Editing View
</div>
</body>
JavaScript function m using at the moment is
function getHighlightedString()
{
var text = document.getSelection();
startIndex = text.anchorOffset;
endIndex = text.focusOffset;
selectedText = text.anchorNode.textContent.substr(startIndex, endIndex - text.anchorOffset);
}
Please help me out.
My requirement is to get the start and end character index of the text selected by the user with respect to the main div, lets say "content" div. See sample code below. But when I select the "Rich" word in the web view. Its start and end character index es respective to the where the "span" tag i.e. 1 and 5, respectively. Whereas it should be 12 and 16 w.r.t "content" div.
<html>
<body>
<div id="content" contenteditable="true" style="font-family: Times New Roman; color: #fff; font-size: 18;">
This is <span style="background-color: yellow;">out</span> Rich Text Editing View
</div>
</body>
JavaScript function m using at the moment is
function getHighlightedString()
{
var text = document.getSelection();
startIndex = text.anchorOffset;
endIndex = text.focusOffset;
selectedText = text.anchorNode.textContent.substr(startIndex, endIndex - text.anchorOffset);
}
Please help me out.
Share Improve this question asked Feb 7, 2013 at 12:29 Harshit GuptaHarshit Gupta 1,21014 silver badges27 bronze badges1 Answer
Reset to default 8Here's an answer adapted from this one. The same caveats from that answer apply.
Demo: http://jsfiddle/62Bcf/1/
Code:
function getSelectionCharacterOffsetsWithin(element) {
var startOffset = 0, endOffset = 0;
if (typeof window.getSelection != "undefined") {
var range = window.getSelection().getRangeAt(0);
var preCaretRange = range.cloneRange();
preCaretRange.selectNodeContents(element);
preCaretRange.setEnd(range.startContainer, range.startOffset);
startOffset = preCaretRange.toString().length;
endOffset = startOffset + range.toString().length;
} else if (typeof document.selection != "undefined" &&
document.selection.type != "Control") {
var textRange = document.selection.createRange();
var preCaretTextRange = document.body.createTextRange();
preCaretTextRange.moveToElementText(element);
preCaretTextRange.setEndPoint("EndToStart", textRange);
startOffset = preCaretTextRange.text.length;
endOffset = startOffset + textRange.text.length;
}
return { start: startOffset, end: endOffset };
}
发布者：admin，转转请注明出处：http://www.yc00.com/questions/1744689261a4588108.html
评论列表（0条）