如何从tinymce编辑器中插入图像?

时间:2020-11-30 00:27:54

I am trying to use the tinymce text editor, but am not being able to get the contents of the editor using jQuery , and also if I use the simple post method to get the value I get the text, but am not getting the image?

我正在尝试使用tinymce文本编辑器,但是我无法使用jQuery获取编辑器的内容,而且如果我使用简单的post方法来获取值,我得到文本,但是我没有得到图像?

The code I tried using jQuery was:

我尝试使用jQuery的代码是:

$(document).ready(function()
{
    $("#save").click(function()
    {
        $.post("test_skin_dump.php",{
            data_info:$("#elm2").html;
        } ,function(data) {
            if(data)
            {
                $("#show_result").html(data);
            }               
        });
    });
}); 

<textarea id="elm2" name="elm2" rows="15" cols="80" style="width: 80%"> 
</textarea>

What am I doing wrong could anybody correct me, please?

我做错了什么可以有人纠正我,拜托?

3 个解决方案

#1


TinyMCE has its own API which you can take advantage of. In fact, it is really not too bad. In your case, you can get the entire of the editor via:

TinyMCE有自己的API,你可以利用它。事实上,这真的不是太糟糕。在您的情况下,您可以通过以下方式获取整个编辑器:

tinyMCE.activeEditor().getBody();

If you are sure that the user has clicked on the image (i.e. selected), then you can do this to only get the image node:

如果您确定用户已单击图像(即已选中),则可以执行此操作以仅获取图像节点:

tinyMCE.activeEditor().selection.createHTML();

Note that .selection is a property, which is why it doesn't have a set of parentheses.

请注意.selection是一个属性,这就是为什么它没有一组括号。

If you do not like any of this code, or for some reason it doesn't quite answer your question, feel free to check out the following links:

如果您不喜欢这些代码,或者由于某种原因它不能完全回答您的问题,请随时查看以下链接:

  • EditorManager - this is the tinyMCE object
  • EditorManager - 这是tinyMCE对象

  • API

Let me know if there is anything else you need.

如果您还有其他需要,请告诉我。

#2


html is a function. You are missing the parentheses. You also have an extra semicolon.

html是一个功能。你错过了括号。你还有一个额外的分号。

Replace this:

data_info:$("#elm2").html;

With this:

data_info:$("#elm2").html()

The rest looks fine.

其余的看起来很好。

#3


Use the following Command to Inset the Code into your editor:

使用以下命令将代码插入编辑器:

tinyMCE.execCommand('mceInsertContent',false,'<img src="mypic.png" />');

Hope this Helps :)

希望这可以帮助 :)

#1


TinyMCE has its own API which you can take advantage of. In fact, it is really not too bad. In your case, you can get the entire of the editor via:

TinyMCE有自己的API,你可以利用它。事实上,这真的不是太糟糕。在您的情况下,您可以通过以下方式获取整个编辑器:

tinyMCE.activeEditor().getBody();

If you are sure that the user has clicked on the image (i.e. selected), then you can do this to only get the image node:

如果您确定用户已单击图像(即已选中),则可以执行此操作以仅获取图像节点:

tinyMCE.activeEditor().selection.createHTML();

Note that .selection is a property, which is why it doesn't have a set of parentheses.

请注意.selection是一个属性,这就是为什么它没有一组括号。

If you do not like any of this code, or for some reason it doesn't quite answer your question, feel free to check out the following links:

如果您不喜欢这些代码,或者由于某种原因它不能完全回答您的问题,请随时查看以下链接:

  • EditorManager - this is the tinyMCE object
  • EditorManager - 这是tinyMCE对象

  • API

Let me know if there is anything else you need.

如果您还有其他需要,请告诉我。

#2


html is a function. You are missing the parentheses. You also have an extra semicolon.

html是一个功能。你错过了括号。你还有一个额外的分号。

Replace this:

data_info:$("#elm2").html;

With this:

data_info:$("#elm2").html()

The rest looks fine.

其余的看起来很好。

#3


Use the following Command to Inset the Code into your editor:

使用以下命令将代码插入编辑器:

tinyMCE.execCommand('mceInsertContent',false,'<img src="mypic.png" />');

Hope this Helps :)

希望这可以帮助 :)