我正在创建一个自定义主题。在这个主题中,我在编辑页面屏幕中有一些自定义选项。为此,我有一个自定义按钮,单击它会打开我创建的覆盖div(该覆盖有自定义选项字段)。按钮和覆盖的HTML都是通过“post\\u submitbox\\u misc\\u actions”操作输出的。它的基本形式在我的函数中是这样的。php文件:
add_action( \'post_submitbox_misc_actions\', \'add_custom_button\' );
function add_custom_button() {
global $current_screen;
if( $current_screen->post_type == \'page\' ) {
//The custom button and HTML is echoed out here
}
}
现在,我想在我的overlay div中添加默认的Wordpress编辑器作为一个字段。首先,我从codex中选取了一个基本示例:
$content = \'\';
$editor_id = \'mycustomeditor\';
wp_editor( $content, $editor_id );
但是,这表明我对它的一些功能有问题。例如,如果我单击“文本”选项卡,什么都不会发生,单击“插入下载”、“添加媒体”按钮也一样。如果单击“插入下载”按钮,URL将附加“#TB\\u inline?width=640&;inlineId=选择下载”,但不会发生其他任何情况。编辑器上的所有其他按钮都可以工作。
我已经检查了浏览器控制台,当编辑器加载/我单击编辑器上的按钮时,没有收到任何JavaScript错误。
在“admin\\u enqueue\\u scripts”操作中:
wp_enqueue_media();
函数被调用。
要使用编辑器,我还需要做些什么,或者我遗漏了什么或设置不正确吗?
最合适的回答,由SO网友:thairish 整理而成
问题在于我是如何创建覆盖图的。我几乎是在单击父对象时使用e.stopPropagation()来阻止内部div在覆盖上关闭。使用e.stopPropagation()阻止了wp编辑器的一些单击。
相反,我使用了一个只在父元素上应用覆盖关闭的检查,而不是删除e.stopPropagation()使用的子元素。
$( "#parent_overlay" ).click( function( e ) {
//Without this check all inner elements would also apply the closing code
if( e.target == this ) {
$( "#parent_overlay" ).fadeOut();
$( "body" ).removeClass( "noscroll" );
}
});