访问WordPress的TinyMCE iFrame [英] Accessing WordPress's TinyMCE iFrame

问题描述

使用jQuery我试图操纵WordPress内容编辑器，它在iframe中使用TinyMCE。我似乎无法使以下代码按预期工作：

Using jQuery I'm trying to manipulate the WordPress content editor, which uses TinyMCE inside of an iframe. I can't seem to get the following code to work as intended:

jQuery(document).ready(function($) {
$('#content_ifr').ready(function() {
    $('#content_ifr').contents().find('body').css('background-color', '#f33');
});

无论我是否使用.ready （）或。load（），事件将在TinyMCE编辑器（iframe的主体）完全加载之前触发。

Regardless of whether I use ".ready()" or ".load()", the event will fire before the TinyMCE editor (the body of the iframe) is completely finished loading.

但是，以下如果我在手动点击标题文本框以激活click事件之前等待iframe加载，代码将起作用：

However, the following code will work if I wait for the iframe to load before manually clicking the title textbox to fire the click event:

jQuery(document).ready(function($) {
$('#title').click(function() {
    $('#content_ifr').contents().find('body').css('background-color', '#f33');
});

我已经详尽地搜索了jQuery和iFrames的主题，看起来它是一个受欢迎或错过取决于情境一些代码适用于某些人，而不适用于其他人。

I've searched exhaustively on the subject of jQuery and iFrames, and it seems it's a hit or miss depending on the situation. Some code works for some people and not for others.

有人知道在TinyMCE iframe主体完成后获取第一个代码片段的方法加载？因为它只是WordPress内容编辑器，所以iframe内容位于同一个域中。

Does anyone know of a way to get the first code snippet to fire after the TinyMCE iframe body is completely finished loading? Because it's just the WordPress content editor, the iframe content is on the same domain.

我真正想做的是通过iframe中的body元素添加一个类.addClass（）

What I really want to do is add a class to the body element in the iframe via .addClass()

jQuery(document).ready(function($) {
$('#content_ifr').ready(function() {
    $('#content_ifr').contents().find('body').addClass('ui-droppable');
});

以便我可以在以下教程中应用拖放代码：

so that I can apply the drag n' drop code in the following tutorial:

http ：//skfox.com/2008/11/26/jquery-example-inserting-text-with-drag-n-drop/

推荐答案

您可以使用 tiny_mce_before_init 钩子在tinymce.init

You can use the tiny_mce_before_init hook to add a class to the body before tinymce.init

function my_tiny_mce_before_init( $init_array ) {
    $init_array['body_class'] = 'some-class some-other-class';
    return $init_array;
}
add_filter('tiny_mce_before_init', 'my_tiny_mce_before_init');

这篇关于访问WordPress的TinyMCE iFrame的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！