3

私の要件は、メイン div に関してユーザーが選択したテキストの開始文字インデックスと終了文字インデックスを取得することです。たとえば、「コンテンツ」div としましょう。以下のサンプルコードを参照してください。しかし、Web ビューで「Rich」という単語を選択すると。その開始文字インデックスと終了文字インデックスは、「span」タグの場所、つまりそれぞれ 1 と 5 に対応します。一方、「コンテンツ」divについては12と16である必要があります。

<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 関数 m は

function getHighlightedString()
{
    var text = document.getSelection();
    startIndex = text.anchorOffset;
    endIndex = text.focusOffset;
    selectedText = text.anchorNode.textContent.substr(startIndex, endIndex - text.anchorOffset);
}

私を助けてください。

4

1 に答える 1

8

これがこれを応用した答えです。その答えからの同じ警告が当てはまります。

デモ： http： //jsfiddle.net/62Bcf/1/

コード：

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 };
}
于 2013-02-07T12:38:12.683 に答える