5

偽のカーソルがWYSIWYGエディターの下の特定の位置にあるときに、textareaの実際のキャレット位置を取得できるかどうか疑問に思っていますか？

質問をよりよく理解するには、下の画像を参照してください

ここに画像の説明を入力してください WYSIWYGモードでは、カーソルがsの後にある場合、位置53を取得します。カーソルがtの後にあるとき、位置79を取得します。

コードは次のようになります...

function getRealCaretPosition() {
    // all the dirty work goes here
}

// Ctrl + Q
if(e.ctrlKey && e.which == 81) {
    var pos = getRealCaretPosition();
    alert(pos);
}

理論的には、これを達成することは可能ですか？

4

2 に答える 2

2

window.getSelection()現在の選択ポイントが表示され、ここからノードの開始までツリーウォークが逆方向に進み、検出されたすべてのテキストノードの長さが追加されます。

function walkback(node, stopAt) {
    if (node.childNodes && node.childNodes.length) { // go to last child
        while (node && node.childNodes.length > 0) {
            node = node.childNodes[node.childNodes.length - 1];
        }
    } else if (node.previousSibling) { // else go to previous node
        node = node.previousSibling;
    } else if (node.parentNode) { // else go to previous branch
        while (node && !node.previousSibling && node.parentNode) {
            node = node.parentNode;
        }
        if (node === stopAt) return;
        node = node.previousSibling;
    } else { // nowhere to go
        return;
    }
    if (node) {
        if (node.nodeType === 3) return node;
        if (node === stopAt) return;
        return walkback(node, stopAt);
    }
    return;
}

function getRealCaretPosition() {
    var sel = window.getSelection(), // current selection
        pos = sel.anchorOffset, // get caret start position
        node = sel.anchorNode; // get the current #text node
    while (node = walkback(node, myContentEditableElement)) {
        pos = pos + node.data.length; // add the lengths of the previous text nodes
    }
    return pos;
}

もちろん、現在の選択が実際に対象のHTMLElement内にあることを確認する必要があります。

于 2013-02-24T16:21:09.943 に答える
0

はい、これを説明するtinyMCEでカバーされているトピックがあります：

var inst = getInstanceById('editor/elementid');
var myBookmark = inst.getBookmark();

// do something, move the cursor position
inst.moveToBookmark(myBookmark);

ソース：これらが機能しない場合は、ここから他の解決策を確認してください。

于 2013-02-24T16:26:42.793 に答える