如何在tinymce中的光标位置插入图像

Question

我正在使用以下代码来获取tinymce的内容。

tinymce_content=tinyMCE.get('txt_area_id').getContent();
updated_content=tinymce_content+"<img src="sample.jpg">";

通过使用上述代码，我将图像插入到 tinymce 内容中。

问题：如何在tinymce内的光标位置插入图像（即）如何预测光标位置并分割内容以在获取的内容之间插入图像。

提前致谢

Answer 1

@Thariama's answer 在 Chrome 中对我来说工作得很好，但在 IE 中却不行。我必须将其修改为以下内容才能使其在两种浏览器中都能正常工作：

var ed = tinyMCE.get('txt_area_id');                // get editor instance
var newNode = ed.getDoc().createElement ( "img" );  // create img node
newNode.src="sample.jpg";                           // add src attribute
ed.execCommand('mceInsertContent', false, newNode.outerHTML)

（IE 告诉我 range 没有 insertNode 方法。）

Answer 2

这将在tinymce编辑器中的选定点（光标位置）插入一个图像节点

var ed = tinyMCE.get('txt_area_id');                // get editor instance
var range = ed.selection.getRng();                  // get range
var newNode = ed.getDoc().createElement ( "img" );  // create img node
newNode.src="sample.jpg";                           // add src attribute
range.insertNode(newNode);                          // insert Node