ajax – 在thickbox中添加wp_editor
发布时间：2020-12-16 02:47:11 所属栏目：百科 来源：网络整理
导读：我想在前端的模态对话框(thickbox)中添加一个wp_editor,但只获得一个没有按钮的空编辑器.(WordPress 3.5和插件开发) wp_editor通过ajax调用连接… 似乎页面中缺少一些重要的javascripts. 是否有可能以某种方式预加载编辑器脚本？ 这是一个公开问题的示例插件
|
我想在前端的模态对话框(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方法分配给一个元素,更改代码 （编辑：李大同） 【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容! |