我有一个 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>