我遇到了tinyMCE的问题,当我将<script type="text/javascript" src="/scripts/tiny_mce/tiny_mce.js">
放到<head>
,并将初始代码放在<textarea class="tinyMceEditor">
之前时,它运行正常。
init代码是这样的:
tinyMCE.init({
mode : "specific_textareas",
editor_selector : "tinyMceEditor",
plugins : "inlinepopups,advlink",
convert_urls : false,
theme : "advanced",
theme_advanced_buttons1 : "link,unlink",
width: "602",
height: "175",
theme_advanced_statusbar_location : "none"});
但是现在,我想推迟加载tiny_mce.js,当用户第一次点击按钮时,将加载tiny_mce.js,然后将<textarea class="tinyMceEditor">
追加到<body>
,然后使用前面的代码执行init工作,但这一次,它不会初始化tinyMCE编辑器,它只显示<textarea class="tinyMceEditor">
任何建议都将受到赞赏。
我查看了chrome web开发人员工具,发现如果我动态加载tinymce.js,其他需要的js,如en.js,editor_template.js,editor_plugin.js等将不会被加载。即使我将这些js文件添加到动态加载中,仍然无法使用这些文件。
谢谢你的帮助,我在firebug中观看,并且在将<textarea
追加到<body>
之前我确实已经加载了tinymce.js,然后我追加<textarea>
,然后执行tinymce init()
,我正在使用LazyLoad(jQuery插件)来动态加载js文件。
这就是我做的事情
if(typeof TinyMCE == "undefined"){
//dynamically load the tinymce.js
LazyLoad(['tinymce.js'],function(){
//callback function, called after tinymce is loaded
$('body').append('<textarea class="TinyMceEditor"/>');
tinyMCE.init({init settings});
});
}
如果我没有动态加载tinymce.js,只需在<script>
中添加<head>
标记,就可以使用tinyMCE,但是当我动态加载tinymce.js时,它不起作用。对此有什么想法?
答案 0 :(得分:27)
window.tinymce.dom.Event.domLoaded = true;
之前
tinymce.init();
然后可以正确地进行注射。
答案 1 :(得分:1)
我通过创建一个单独的coffee脚本文件解决了此问题。然后,我声明了下面带有窗口范围的函数以在视图中进行访问。
window.initialize_tiny_mce = () ->
if (typeof tinymce != 'undefined' && tinymce != null)
tinymce.remove();
tinymce.init
height: '180'
menubar: false
statusbar: false
cleanup: true
selector: '.new-tinymce-printable-html'
plugins: [ 'autolink link image code lists advlist' ]
toolbar: 'styleselect | bold underline italic | bullist numlist outdent indent | link image | code'
browser_spellcheck: true
setup: (editor) ->
editor.on 'keyup', ->
tinymce.triggerSave()
editor.on 'change', ->
console.log editor.getContent()
return
return
然后在局部视图中,我调用了此函数:
:coffeescript
initialize_tiny_mce()
现在为动态创建的元素分配了tinymce编辑器。