在RTF文本编辑器中的光标位置处以html字符串形式将文本或图像或文件插入/附加

Question

I am using a rich text editor and trying to insert file or some image at the desired cursor position. But, the files or image is not being added in between text or in between two files or in between two images, it is being added at the end of image/file.

What should I do so that any image/text/file get added at desired cursor position.

I am trying to implement this in ios mobile app and safari browser but perhaps it is not a browser-specific issue.

<div id="editor" contenteditable="true"></div>

editor.js

 var RTE = {};

RTE.editor = document.getElementById("editor");

RTE.insertFileComponent = function(fileId, fileName, fileSize, type, componentId) {
    var htmlTag = '<div contenteditable="false" class="attach"><div class="fileMetaData">'+ fileName +'</div>';
    document.getElementById('editor').focus();
    RTE.insertHTML(htmlTag);
    RTE.updateContentOffset();
    window.webkit.messageHandlers.general.postMessage("input");
    }

RTE.updateContentOffset = function() {
    var object = {
    caretYPosition: RTE.getCaretYPosition(),
    lineHeight: RTE.getLineHeight()
    };
    window.webkit.messageHandlers.offsetDidChange.postMessage(object);
    };


    RTE.insertHTML = function(html) {
         RTE.restorerange();
         document.getElementById('editor').focus();
         document.execCommand('insertHTML', false, html);
         RTE.updateHeight();
    };


    RTE.updateHeight = function() {
     var object = {
    clientHeight: document.getElementById('editor').clientHeight,
    relativeCaretYPosition: RTE.getRelativeCaretYPosition(),
    lineHeight: RTE.getLineHeight()
    };
     window.webkit.messageHandlers.heightDidChange.postMessage(object);
    };


RTE.restorerange = function() {
 var selection = window.getSelection();
selection.removeAllRanges();
 var range = document.createRange();
 range.setStart(RTE.currentSelection.startContainer, RTE.currentSelection.startOffset);
range.setEnd(RTE.currentSelection.endContainer, RTE.currentSelection.endOffset);
selection.addRange(range);
}