jquery - 访问 WordPress 的 TinyMCE iFrame

Question

使用 jQuery 我正在尝试操作 WordPress 内容编辑器，它在 iframe 内使用 TinyMCE。我似乎无法让以下代码按预期工作:

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

无论我使用“.ready()”还是“.load()”，该事件都会在TinyMCE编辑器(iframe的主体)完全完成加载之前触发。

但是，如果我等待 iframe 加载后再手动单击标题文本框以触发单击事件，则以下代码将起作用:

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

我已经对 jQuery 和 iFrames 的主题进行了详尽的搜索，看来它的成功或失败取决于具体情况。有些代码适用于某些人，但不适用于其他人。

有谁知道如何在 TinyMCE iframe 主体完全加载完成后触发第一个代码片段？因为它只是 WordPress 内容编辑器，所以 iframe 内容位于同一域中。

我真正想做的是通过 .addClass() 将一个类添加到 iframe 中的 body 元素

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

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

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

Answer 1

您可以使用tiny_mce_before_init钩子(Hook)在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');