我正在整合tinyMCE编辑器以及使用Zend Framework开发的系统。
以下是tinymce编辑器代码的部分视图的代码
<script type="text/javascript" src="<?php echo $this->baseUrl()?>/js/tinymce/jquery.tinymce.js"></script>
<script type="text/javascript" src="<?php echo $this->baseUrl()?>/js/jquery.validate.tinymce.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('textarea.editor').tinymce({
script_url : '<?php echo $this->baseUrl()?>/js/tinymce/tiny_mce.js',
// General options
theme : "advanced",
plugins : "pagebreak,style,layer,table,save,advhr,advimage,advlink,emotions,iespell,inlinepopups,insertdatetime,preview,media,searchreplace,print,contextmenu,paste,directionality,fullscreen,noneditable,visualchars,nonbreaking,xhtmlxtras,template,advlist",
// Theme options
theme_advanced_buttons1 : "save,newdocument,|,bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,styleselect,formatselect,fontselect,fontsizeselect",
theme_advanced_buttons2 : "cut,copy,paste,pastetext,pasteword,|,search,replace,|,bullist,numlist,|,outdent,indent,blockquote,|,undo,redo,|,link,unlink,anchor,image,cleanup,help,code,|,insertdate,inserttime,preview,|,forecolor,backcolor",
theme_advanced_buttons3 : "tablecontrols,|,hr,removeformat,visualaid,|,sub,sup,|,charmap,emotions,iespell,media,advhr,|,print,|,ltr,rtl,|,fullscreen",
theme_advanced_buttons4 : "insertlayer,moveforward,movebackward,absolute,|,styleprops,|,cite,abbr,acronym,del,ins,attribs,|,visualchars,nonbreaking,template,pagebreak",
theme_advanced_toolbar_location : "top",
theme_advanced_toolbar_align : "left",
theme_advanced_statusbar_location : "bottom",
theme_advanced_resizing : true
});
});
</script>
问题是当视图加载到ajax中时,在提交按钮的click事件上调用以下内容:
var content = tinyMCE.get('body').getContent();
alert(content);
返回一个空字符串。如果视图正常加载一切正常。这只是在FF中。即使使用Ajax,Chrome和IE8也能正常运行。
有没有人有过这方面的经验?
编辑: 基本上我的应用程序使用的是MVC结构。视图是MVC的V部分。加载到浏览器的主页是一个项目列表页面,其中包含“添加新”按钮。单击后,将通过ajax加载新视图并将其添加到页面中。加载的视图既包含tinymce的所有javascript代码,也包含textarea HTML。除了没有在FF
上工作的getContent()调用之外,它的工作正常答案 0 :(得分:3)
自己进入这个并且“修复”是一只野兽。从广义上讲,Tiny在其实例中存储对DOM元素(document,body,contentFrame,contentWindow)的引用。我认为(但不是100%肯定)它最终也会在其内部DOM,Selection和其他工具生成的闭包中创建对它们的引用。因为它是这样做的,当你查看更改时,旧的DOM被吹走并被新的东西替换(可能具有相同的ID?),但内部引用被保留。
我需要实现以支持IEx,FF3.x,WebKit(Chrome和Safari)的解决方案是调用类似BEFORE之类的任何代码来重绘RTE区域:
for(var i=0, n=tinymce.editors.length; i<n; i++) {
tinymce.editors[i].destroy();
delete document.getElementById(tinymce.editors[i].id);
}
答案 1 :(得分:2)
我不确定,但我认为可能是因为几个具有相同身份的tinymce实例。
如果您使用firebug,请尝试此操作来检查。
for (var i = 0; i < tinymce.editors.length; i++) {
console.log(tinymce.editors[i].id);
}
如果id加倍,你就会遇到问题的根源。