微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

ajax – 在thickbox中添加wp_editor

我想在前端的模态对话框(thickBox)中添加一个wp_editor,但只获得一个没有按钮的空编辑器.(wordpress 3.5和插件开发)

wp_editor通过ajax调用连接…

似乎页面中缺少一些重要的javascripts.

是否有可能以某种方式预加载编辑器脚本?

这是一个公开问题的示例插件(为每个内容添加一个编辑链接):

<?PHP
/*
Plugin Name: ThickBoxEditor
*/

$thickBoxeditor = new ThickBoxEditor();

class ThickBoxEditor{

    function __construct()
    {

        add_action( 'wp_print_styles',array( &$this,'wp_print_styles' ) );
        add_action( 'init','init' ) );
        add_filter( 'the_content','the_content' ) );
        add_action( 'wp_ajax_thickBoxeditor','editor' ) );
        add_action( 'wp_ajax_nopriv_thickBoxeditor','editor' ) );

    }

    function the_content( $content ){

        $content .= '<a href="' . admin_url( 'admin-ajax.PHP' ) . '?action=thickBoxeditor" class="thickBox" title="Add new note">EDIT THICKBoxEDITOR</a>';

        return $content;

    }

    function editor(){

        wp_editor( $this->postcontent,'postcontent',array(
            'media_buttons' => false,'teeny' => false,'textarea_rows' => '7','tinymce' => array( 'plugins' => 'inlinepopups,fullscreen,wordpress,wplink,wpdialogs' )
        ) );

        die(0);

    }

}
?>

UPDATE

感谢@danielauener,一个解决方案是初始化mceAddControl.所以这是同一个插件的工作示例:

<?PHP
/*
Plugin Name: ThickBoxEditor
*/

$thickBoxeditor = new ThickBoxEditor();

class ThickBoxEditor{

    function __construct()
    {

        add_action( 'wp_print_styles','editor' ) );
        add_action( 'wp_footer','wp_footer' ) );

    }

    function wp_footer(){

        echo '<!--';
        wp_editor( '','invisible_editor_for_initialization' );
        echo '-->';

    }

    function the_content( $content ){

        $content .= '<a href="' . admin_url( 'admin-ajax.PHP' ) . '?action=thickBoxeditor" class="thickBox" title="Add new note">EDIT THICKBoxEDITOR</a>';

        return $content;

    }

    function editor(){

        wp_editor( '',wpdialogs' )
        ) );

        ?>

        <script language="javascript">
            jQuery(document).ready(function(){
                tinymce.execCommand('mceAddControl',true,'postcontent');
            });
        </script>

        <?PHP

        die(0);

    }

}
?>

跳过丑陋的wp_editor初始化会非常好:-)

解决方法

有趣的是,该thickBox不提供任何回调.但正如我在twitter上提到的,我会尝试$.ajaxSuccess调用解决丑陋的js-inject.只需将以下内容添加到您的一个JavaScript文件中:

(function($) {
    // gets called for every successful ajax call
    $(document).ajaxSuccess( function(evt,request,settings) {

        // make sure this call was from your thickBox
        if ($('#your-thickBox-selector').length > 0) {
            tinymce.execCommand('mceAddControl','postcontent');
        }
    }); 
})( jQuery );

更新:必须将ajaxSuccess方法分配给一个元素,更改代码

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 [email protected] 举报,一经查实,本站将立刻删除。

相关推荐