1

我有一个 contentEditable 设置为 true 的 div。

我目前拥有的是 iframe 中的文件上传,它将上传文件的位置设置为变量。然后,我将插入符号放在我想要将其添加到 div 的位置,然后单击另一个按钮以添加图像。

我想做的是将插入符号放在适当的位置,然后单击文件上传。然后,当我选择要上传的文件时,它会记住插入符号所在的位置并在那里添加图像。

所以最终我需要将插入符号位置存储在一个变量中。

我认为这会有所作为,但 div 将包含子元素,例如 a、strong 和 span 标签。

这是我到目前为止获得插入符号位置的内容......

function getCaretPosition(editableDiv) {
    var caretPos = 0;
    sel = window.getSelection();
        if (sel.rangeCount) {
            range = sel.getRangeAt(0);
            if (range.commonAncestorContainer.parentNode == editableDiv) {
                caretPos = range.endOffset;
            }
        }

    return caretPos;
}

$('.peCont').bind('keyup mouseup', function() { 
    $("p").html(getCaretPosition(this));
});​ 

<div class="peCont" contenteditable="true">Text goes here along with <b>some <i>HTML</i> tags</b>.</div>
<p></p>​

http://jsfiddle.net/cDNZK/

4

0 回答 0