更新2014年3月31日* 我发现问题出在iframe中。设置它并且不在iframe中加载页面工作正常。那么如何定位iframe中的打开窗口？
原始问题 我两天前在tinymce论坛上问过这个问题，但没有收到任何反应，所以我在这里试试运气。 For the forum post on tinymce.com click here
我制作了自定义图片浏览器。这完全打开了。但是当点击图像插入它时会发生以下错误：
Uncaught TypeError: Cannot read property 'activeEditor'
此代码适用于早期实现的tinymce 4.主要区别在于这一切都发生在iframe中。所以代码加载到iframe中，之后我应用了tinymce编辑器。我不知道这是否是问题的原因，但我怀疑是因为iframe中的所有工作都完全正常，而http://fiddle.tinymce.com/上的编辑器也加载到iframe中。
那为什么不能定义activeEditor呢？我添加了以下代码：
// tinymce的初始化代码：
$(document).ready(function()
{
var baseUrl = (!window.location.origin) ? window.location.origin = window.location.protocol + '//' + window.location.host : '';
function browser(field_name, url, type, win)
{
if(type === 'media')
{
tinyMCE.activeEditor.windowManager.alert('There is no browser dialog available for this plugin');
}
else
{
var cmsURL = window.location.toString(); // script URL - use an absolute path!
cmsURL = 'type=' + (cmsURL.indexOf("?") < 0) ? cmsURL + ' ?type=' + type : cmsURL + ' &type=' + type;
switch(type)
{
case 'image':
var browserUrl = baseUrl + '/images/browser/';
var dialogTitle = 'Images';
break;
case 'file':
var browserUrl = baseUrl + '/filebrowser/';
var dialogTitle = 'Files';
break;
}
tinymce.win_image = tinymce.activeEditor.windowManager.open({
url: browserUrl,
title: dialogTitle,
width : 701,
height : 500,
resizable : 'yes',
inline : 'yes',
close_previous : 'no'
}, {
window : win,
input : field_name,
oninsert: function(url, title)
{
win.document.getElementById(field_name).value = url;
}
});
return false;
}
}
$(function()
{
$('body').find('div[contenteditable="true"][data-content]').tinymce({
script_url : '../tinymce/tinymce.min.js',
theme: 'modern',
skin : 'dgp',
plugins: [
'advlist autolink lists link image charmap print preview hr anchor pagebreak',
'searchreplace wordcount visualblocks visualchars code fullscreen',
'insertdatetime media nonbreaking save table contextmenu directionality',
'emoticons template paste textcolor'
],
toolbar1: 'undo redo | alignleft aligncenter alignright alignjustify | bullist numlist | outdent indent | charmap',
toolbar2: 'styleselect | bold italic strikethrough | removeformat | link unlink | image media',
add_unload_trigger: false,
entity_encoding : 'raw',
inline_styles : false,
inline: true,
schema: 'html5',
element_format : 'xhtml',
relative_urls: false,
absolute_urls: true,
convert_urls : false,
image_advtab: false,
statusbar: false,
panel_align: 'auto',
link_list: baseUrl + '/pages/links/',
file_browser_callback : browser,
menu: {
edit: {title: 'Edit', items: 'cut copy paste | selectall | searchreplace'},
insert: {title: 'Insert', items: 'hr nonbreaking anchor insertdatetime emoticons'},
view: {title: 'View', items: 'visualblocks'},
table: {title: 'Table', items: 'inserttable tableprops deletetable cell row column'},
tools: {title: 'Tools', items: 'code'}
},
insertdate_formats: ['%H:%M:%S', '%r', '%d-%m-%Y', '%d/%m/%Y', '%m-%d-%Y', '%m/%d/%Y'],
insertdate_timeformat: '%H:%M:%S',
style_formats: [
{title: 'Headers', items: [
{title: 'Header 1', format: 'h1'},
{title: 'Header 2', format: 'h2'},
{title: 'Header 3', format: 'h3'},
{title: 'Header 4', format: 'h4'},
{title: 'Header 5', format: 'h5'},
{title: 'Header 6', format: 'h6'}
]},
{title: 'Inline', items: [
{title: 'Superscript', icon: 'superscript', format: 'superscript'},
{title: 'Subscript', icon: 'subscript', format: 'subscript'},
{title: 'Code', icon: 'code', format: 'code'}
]},
{title: 'Blocks', items: [
{title: 'Paragraph', format: 'p'},
{title: 'Blockquote', format: 'blockquote'}
]},
{title: 'Images', items: [
{title: 'Left', selector: 'img', classes: 'left'},
{title: 'Right', selector: 'img', classes: 'right'},
{title: 'Center', selector: 'img', classes: 'center'},
{title: 'No enlarge', selector: 'img', classes: 'no-enlarge'}
]},
{title: 'Links', items: [
{title: 'Link block', selector: 'a', classes: 'link-block'},
{title: 'Link block active', selector: 'a', classes: 'link-block-active'}
]}
]
});
});
});
//浏览器对话框窗口代码
<script src="<?php echo $this->Versioning('../js/libs/jquery-1.9.1.js'); ?>"></script>
<link rel="stylesheet" type="text/css" href="<?php echo $this->Versioning('..css/style.css'); ?>" />
<script>
var browserDialogue = {
init : function(){},
submit : function(url, title, height, width)
{
top.tinymce.activeEditor.windowManager.getParams().oninsert(url, title, height, width);
top.tinymce.activeEditor.windowManager.close();
}
};
</script>
<?php
if(count($this->images) > '0')
{
?>
<ul class="list-images sort-tag-items browser-fix">
<?php
foreach($this->images as $result)
{
?>
<li class="<?php echo $result->tag_id; ?>">
<div>
<a href="javascript:browserDialogue.submit('<?php echo '/public/img/original/'.$result->filename; ?>?s=<?php echo $result->size.$result->width.$result->height; ?>','<?php echo $result->filename; ?>', '<?php echo $result->height/2; ?>', '<?php echo $result->width/2; ?>');" title="<?php echo $this->translate('Place %s', $result->filename); ?>" alt="<?php echo $this->translate('Place %s', $result->filename); ?>"><img src="/public/uploads/images/100/<?php echo $result->filename; ?>" title="<?php echo $this->translate('Place %s', $result->filename); ?>" alt="<?php echo $this->translate('Place %s', $result->filename); ?>"/></a>
</div>
</li>
<?php
}
?>
</ul>
<?php
}
else
{
?><div class="empty"><?php echo $this->translate('No %s found! Start uploading %s right now!', 'image(s)', 'image(s)'); ?></div><?php
}
答案 0 :(得分：1)
我修好了。在尝试了大量不同的东西来定位图像对话框后，结果发现top不对。因此，在您的浏览器功能中使用top.tinymce.....代替parent.tinymce.....。