我已经在计算器关于这个话题已经有答案了研究几个类似的问题。
I have researched several similar questions on stackoverflow about this topic that already have answers.
有些答案似乎并不完全工作，有的只是在我的头上。
Some of the answers don't seem to fully work and some are just over my head.
我一直在阅读和返工我的code了一个多星期，所以我虽然我会再试一次，询问更多的细节比其他的问题了。
I have been reading and reworking my code for over a week so I though I would try asking again with more detail than the other questions had.
我写了一个很简单的一句话preSS的插件，在生活中的唯一目的是加载通过AJAX一个全功能的编辑器。
I've written a very simple WordPress plugin that's only purpose in life is to load a fully functional editor via ajax.
下面是这个插件的工作（使用错误）的截屏： http://screencast.com/t/eyrTdbUy
Here is a screencast of this plugin working (with errors): http://screencast.com/t/eyrTdbUy
我想，如果我的问题都可以回答它会帮助很多人。
I think that if my question can be answered it will help a lot of people.
下面正是插件一样。
它加载我的自定义页面模板，而不是主题模板。在该模板存在与wp_editor功能（加载所需的文件）创建了一个编辑器和一个链接来添加新的编辑
It loads my custom page template instead of the theme template. In this template there is a editor created with the wp_editor function (to load the required files) and a link to add a new editor.
当你点击添加编辑链接使用通过ajax然后用javascript和新的链接初始化wp_editor功能被添加到再添创建一个新的编辑器。
When you click the "add editor" link a new editor is created using the wp_editor function via ajax then initialized with javascript and new link is added to add another.
这仅当用户登录工作。
我不会建议对您的活动网站上安装这个，因为它会接管你的网页。这个插件，例如只所以应该只在测试站点上安装。
I wouldn't advise installing this on your active website because it will take over your pages. This plugin is for example only so it should only be installed on tester sites.
这里的问题...
的AJAX加载编辑作品的第一个实例，但是还有就是，当你点击选项卡切换，从视觉来回文本下面的错误 类型错误：电子是未定义 类型错误：未定义C The first instance of the ajax loaded editor works but there is the following errors when you click the tabs to switch back and forth from visual to text "TypeError: e is undefined" "TypeError: c is undefined"在类型错误：e是未定义也当第一个新的编辑器加载发生
The "TypeError: e is undefined" also happens when the first new editor is loaded.
在加载的第一个实例后，其他编辑器不能被添加。所以我的问题是...什么是错我的code？
So my question is... What is wrong with my code?
该插件是由4个文件。
文件1的插件文件load_editor.php（它只是包含的功能）：
include('functions.php');
文件2的功能文件的functions.php：
<?
// load custom editor template
function load_editor_template( $template )
{
$template = plugin_dir_path( __FILE__ ) . 'template.php';
return $template;
}
add_filter( 'template_include', 'load_editor_template' );
// load javascript
function load_editor_scripts() {
wp_enqueue_script( 'load_editor', plugins_url() . '/load_editor/js/load_editor.js', array(), '', true );
wp_enqueue_script( 'jquery');
}
add_action( 'wp_enqueue_scripts', 'load_editor_scripts' );
// create new editor
function load_editor_new_editor() {
$id = $_POST['id'];
$number = $_POST['number'];
$next = $number + 1;
$full_id = $id.$number;
echo "<h1>Editor $number</h1>";
$content = '<p>This is example content.</p>';
wp_editor($content, $full_id, array('textarea_rows' => 3));
// initiate new editor
echo "<script>
tinyMCE.execCommand('mceAddEditor', true, $full_id);
tinyMCE.init(tinyMCEPreInit.mceInit[$full_id]);
</script>";
// create "add new" text
echo "<div><a onclick="load_new_editor('editor', $next);" href='javascript:void(0);'>Click here</a> to add another editor</div>";
die();
}
add_action( 'wp_ajax_load_editor_new_editor', 'load_editor_new_editor' );
文件3是模板文件的template.php：
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Load Editor</title>
<?php wp_head(); ?>
</head>
<body>
<? wp_editor('Ecample content', 'id', array('textarea_rows' => 3)); ?>
<div id="add"><a onClick="load_new_editor('editor', 1);" href="javascript:void(0);">Click here</a> to add an editor</div>
<div id="editor_container">
<!-- Editors will load here -->
</div>
<script>
<?
echo 'ajaxurl = "'.admin_url('admin-ajax.php').'";';
?>
</script>
<?php wp_footer(); ?>
</body>
</html>
和文件4是JavaScript文件load_editor.js：
And file 4 is the javascript file "load_editor.js":
function load_new_editor(id, number){
// remove click to add
jQuery('#add').remove();
var fullId = id + number;
var data = {
'action': 'load_editor_new_editor',
'number': number,
'id': id
};
jQuery.post(ajaxurl, data, function(response) {
//add new editor
jQuery('#editor_container').append(response);
});
}
我也把它放在github上的位置： 这里输入链接的描述
I've also put it on github here: enter link description here
感谢你这么多的帮助，你可以给。我一直在试图得到这个工作了这么长时间它炸了我的大脑。我甚至通过elance雇佣一个程序员，他无法得到像我一样远。
Thank you so much for any help that you can give. I've been trying to get this to work for so long it's frying my brain. I even hired a programmer via elance and he was unable to get as far as I did.
推荐答案
这是最好的，我可以想出，我认为这是对我来说已经足够了。
This is the best I can come up with and I think it is good enough for me.
一切工作除了quicktags，我可以生活在没有他们。
Everything is working except the quicktags and I can live without them.
我从funtions.php删除的JavaScript
<?
// load custom editor template
function load_editor_template( $template )
{
$template = plugin_dir_path( __FILE__ ) . 'template.php';
return $template;
}
add_filter( 'template_include', 'load_editor_template' );
// load javascript
function load_editor_scripts() {
wp_enqueue_script( 'load_editor', plugins_url() . '/load_editor/js/load_editor.js', array(), '', true );
wp_enqueue_script( 'jquery');
}
add_action( 'wp_enqueue_scripts', 'load_editor_scripts' );
// create new editor
function load_editor_new_editor() {
$id = $_POST['id'];
$number = $_POST['number'];
$next = $number + 1;
$full_id = $id.$number;
echo "<h1>Editor $number</h1>";
$content = '<p>This is example content.</p>';
wp_editor($content, $full_id, array('textarea_rows' => 3));
// create "add new" text
echo "<div id='add'><a onclick="load_new_editor('editor', $next);" href='javascript:void(0);'>Click here</a> to add another editor</div>";
die();
}
add_action( 'wp_ajax_load_editor_new_editor', 'load_editor_new_editor' );
然后，我改变了load_editor.js以下
添加了quicktags函数来获取标签没有错误的工作 在调用tinymce.init与设置字preSS使用我觉得就是这样。
// JavaScript Document
function load_new_editor(id, number){
// remove click to add
jQuery('#add').remove();
var fullId = id + number;
var data = {
'action': 'load_editor_new_editor',
'number': number,
'id': id
};
jQuery.post(ajaxurl, data, function(response) {
//add new editor
jQuery('#editor_container').append(response);
// this is need for the tabs to work
quicktags({id : fullId});
// use wordpress settings
tinymce.init({
selector: fullId,
theme:"modern",
skin:"lightgray",
language:"en",
formats:{
alignleft: [
{selector: 'p,h1,h2,h3,h4,h5,h6,td,th,div,ul,ol,li', styles: {textAlign:'left'}},
{selector: 'img,table,dl.wp-caption', classes: 'alignleft'}
],
aligncenter: [
{selector: 'p,h1,h2,h3,h4,h5,h6,td,th,div,ul,ol,li', styles: {textAlign:'center'}},
{selector: 'img,table,dl.wp-caption', classes: 'aligncenter'}
],
alignright: [
{selector: 'p,h1,h2,h3,h4,h5,h6,td,th,div,ul,ol,li', styles: {textAlign:'right'}},
{selector: 'img,table,dl.wp-caption', classes: 'alignright'}
],
strikethrough: {inline: 'del'}
},
relative_urls:false,
remove_script_host:false,
convert_urls:false,
browser_spellcheck:true,
fix_list_elements:true,
entities:"38,amp,60,lt,62,gt",
entity_encoding:"raw",
keep_styles:false,
paste_webkit_styles:"font-weight font-style color",
preview_styles:"font-family font-size font-weight font-style text-decoration text-transform",
wpeditimage_disable_captions:false,
wpeditimage_html5_captions:true,
plugins:"charmap,hr,media,paste,tabfocus,textcolor,fullscreen,wordpress,wpeditimage,wpgallery,wplink,wpdialogs,wpview",
selector:"#" + fullId,
resize:"vertical",
menubar:false,
wpautop:true,
indent:false,
toolbar1:"bold,italic,strikethrough,bullist,numlist,blockquote,hr,alignleft,aligncenter,alignright,link,unlink,wp_more,spellchecker,fullscreen,wp_adv",toolbar2:"formatselect,underline,alignjustify,forecolor,pastetext,removeformat,charmap,outdent,indent,undo,redo,wp_help",
toolbar3:"",
toolbar4:"",
tabfocus_elements:":prev,:next",
body_class:"id post-type-post post-status-publish post-format-standard",
});
// this is needed for the editor to initiate
tinyMCE.execCommand('mceAddEditor', false, fullId);
});
}
下面是它的一个截屏的工作。 http://screencast.com/t/Psd9IVVY
Here is a screencast of it working. http://screencast.com/t/Psd9IVVY
如果有人知道如何让quicktags展现，我很想知道。
If anyone knows how to get the quicktags to show, I would love to know.
另外，如果你发现什么问题我的code让我知道。
Also, if you spot something wrong with my code let me know.
如果你想在这里下载我已经更新了github上： https://github.com/ccbgs/load_editor
I have updated the github if you want to download it here: https://github.com/ccbgs/load_editor
相关推荐
最新文章