Question

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

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

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

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

提前致谢

Answer 1

这将在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

Answer 2

@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方法。）

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

2 个答案: