jQuery - 在 tinyMCE 所见即所得中选择元素答案

【问题标题】：jQuery - Select element inside tinyMCE WYSIWYGjQuery - 在 tinyMCE 所见即所得中选择元素
【发布时间】：2015-12-18 07:12:14
【问题描述】：

我有一个包含一些所见即所得字段的网站（使用 TinyMCE 和 Wordpress 和高级自定义字段）。我想在这些字段中选择和操作一些元素（添加背景图像），但我不知道该怎么做。

如何进入 TinyMCE 的 iFrame 并修改元素？在我选择它们之前，如何确保所有 WYSIWYG 字段都已正确加载？

我正在查看 TinyMCE 4 API，但我仍然不知道。

【问题讨论】：

要在 TinyMCE 编辑器中获取 HTML 元素，请使用 tinymce.activeEditor.getContent({format: 'html'})。
我不想要编辑器中的内容，我想要 ID 为“tinymce”的正文。它位于组成每个编辑器的每个 iframe 内。

标签： jquery tinymce tinymce-4

【解决方案1】：

如何进入 TinyMCE 的 iFrame 并修改元素？

您可以使用此访问Iframe 对象。

tinymce.activeEditor.contentAreaContainer.childNodes[0];

你可以使用这个访问Iframesdocument。

tinymce.activeEditor.contentAreaContainer.childNodes[0].contentWindow.document;

如何确保在选择所有 WYSIWYG 字段之前正确加载它们？

要知道 tinymce 何时完全初始化，请将 on init 事件附加到编辑器的初始化中。

tinymce.init({
    .....    
    setup: function(editor){
         //fired when tinymce is loaded
         editor.on('init', function(e){                
            //All Loaded 
         });                          
    }
});

【讨论】：

【解决方案2】：

您可以使用init_instance_callback 函数来设置 iframe 属性。

【讨论】：

这没有提供问题的答案。要批评或要求作者澄清，请在他们的帖子下方发表评论 - 您可以随时评论自己的帖子，一旦您有足够的reputation，您就可以comment on any post。
@WesFoster 这是批评还是要求澄清？这是一个答案，虽然很短。
init_instance_callback: function (editor) { $('#' + editor.id + '_ifr').addClass('chatFrame'); }