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

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/5192134/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-25 16:19:17  来源:igfitidea点击:

How To insert an image at cursor position in tinymce

javascriptjquerytinymce

提问by Mohan Ram

I am using following codes to fetch the conent of tinymce.

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

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

By using above codes i am inserting image inside tinymce content.

通过使用上面的代码,我将图像插入到 tinymce 内容中。

Question:How to insert image in the cursor position inside tinymce (ie) How to predict cursor position and split the content to insert image between fetched content.

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

Thanks in advance

提前致谢

回答by Thariama

This will insert an image node at the selected spot (cursor position) in a tinymce editor

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

回答by tgray

@Thariama's answerworked fine for me in Chrome, but not in IE. I had to modify it to the following to get it to work in both browsers:

@Thariama 的回答在 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 was telling me that rangedid not have an insertNodemethod.)

(IE 告诉我range没有insertNode方法。)