javascript TinyMCE 4:如何从同一页面上有多个 DIV 内联编辑器的页面获取真正的 HTML 内容?(保存到 1 个文件)

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/26724176/
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-28 06:23:56  来源:igfitidea点击:

TinyMCE 4 : How to get the real HTML content from a page with many DIV inline editors on same page? (save to 1 file)

javascripttinymcetinymce-4

提问by Preben

In my CMS I have many DIVs on one HTML page with inline TinyMCE. Each DIV has it's own instance (#mce_0, and #mce_{randomnumber} )

在我的 CMS 中,我在一个带有内联 TinyMCE 的 HTML 页面上有许多 DIV。每个 DIV 都有自己的实例(#mce_0 和 #mce_{randomnumber} )

Every editable DIV is inside one wrapping DIV (not editable) with a specific ID (#MyWrapper).

每个可编辑的 DIV 都在一个带有特定 ID (#MyWrapper) 的包装 DIV(不可编辑)内。

Everything that is inside #MyWrapper (all the editor DIVs) should be saved to ONE file.

#MyWrapper 中的所有内容(所有编辑器 DIV)都应保存到一个文件中。

When I use javascript to get the html from inside the #MyWrapper it works well, except that I get the HTML used inside the editor, in stead of the REAL HTML I want to have. For example iframes (YouTube-videos) are made into a example-image in stead of a real iframe.

当我使用 javascript 从 #MyWrapper 中获取 html 时,它运行良好,只是我在编辑器中使用了 HTML,而不是我想要的真正的 HTML。例如 iframe(YouTube 视频)被制作成示例图像而不是真正的 iframe。

So, I have then tried to get the HTML code from the editors (same HTML as shown when you click on the "source code" inside the editor).

因此,我尝试从编辑器中获取 HTML 代码(与单击编辑器内的“源代码”时显示的 HTML 相同)。

But I haven't succeeded.

但我没有成功。

Here is how my existing (working, but not getting the real HTML) script works:

这是我现有的(工作,但没有获得真正的 HTML)脚本的工作方式:

1) Get all HTML content in #MyWrapper

1) 获取#MyWrapper 中的所有 HTML 内容

2) Jquery: Add it to a non editable and hidden DIV called #ForSaving , so I can get easy access for saving it

2) Jquery:将其添加到名为 #ForSaving 的不可编辑和隐藏的 DIV 中,以便我可以轻松访问以保存它

3) Then I have a javascript to save it to file.

3)然后我有一个javascript将它保存到文件中。

Today the task #1 (above) is solved using this:

今天,任务#1(上面)是用这个解决的:

jQuery("#ForSaving").html(jQuery(".MyWrapper").html());

BUT I should have a solution to get the real HTML from multiple inline editors in DIVs.

但是我应该有一个解决方案来从 DIV 中的多个内联编辑器中获取真正的 HTML。

I have tried tinymce.get('...'); etc, but I can not seam to get the HTML from multiple editors.

我试过 tinymce.get('...'); 等等,但我无法从多个编辑器中获取 HTML。

Any help is appreciated. :-)

任何帮助表示赞赏。:-)

Addition: I found this by searching for "tinymce multiple instances getcontent": How to get tinyMCE content from more than one text area

另外:我通过搜索“tinymce multiple instances getcontent”发现了这一点: 如何从多个文本区域获取tinyMCE内容

Thariama added a reply telling to use this:

Thariama 添加了一个回复,告诉使用这个:

for (i=0; i < tinyMCE.editors.length; i++){
    var content = tinyMCE.editors[i].getContent();
    alert('Editor-Id(' + tinyMCE.editors[i].id + '):' + content);
}

However I don't understand how to combine this with :

但是我不明白如何将其与:

jQuery("#ForSaving").html(jQuery(".MyWrapper").html());

I am not very good at javascript-coding.

我不太擅长 javascript 编码。

I kindly ask you to help me combine these. Thank you :-)

我恳请你帮我把这些结合起来。谢谢 :-)

回答by vico

shouldn't you just use databases for that? pretty sure you are exposing yourself to huge security flaws by allowing saving like that..

你不应该只使用数据库吗?可以肯定的是,通过允许这样的保存,您将自己暴露在巨大的安全漏洞中。

http://www.tinymce.com/wiki.php/API3:method.tinymce.Editor.getContent

http://www.tinymce.com/wiki.php/API3:method.tinymce.Editor.getContent

straight from the website~

直接上官网~

// Get the HTML contents of the currently active editor
console.debug(tinyMCE.activeEditor.getContent());

// Get the raw contents of the currently active editor
tinyMCE.activeEditor.getContent({format : 'raw'});

// Get content of a specific editor:
tinyMCE.get('content id').getContent()