Ueditor是由百度开发的一个开源的富文本编辑器,有人做了一个将其集成到Django中的方案(请戳),但是在xadmin中却无法正常加载编辑器。
其使用了一个模板用来呈现Ueditor的编辑界面
<textarea name={{ UEditor.name }} id=id_{{ UEditor.name }}
style="display:inline-block;width:{{ UEditor.width }}px;
{{ UEditor.css }}">{{UEditor.value}}</textarea>
<script type="text/javascript">
var id_{{ UEditor.name }}= new baidu.editor.ui.Editor({
"UEDITOR_HOME_URL":"{{ STATIC_URL }}ueditor/",
{% ifnotequal UEditor.toolbars None %}"toolbars":{{ UEditor.toolbars|safe }}
,{% endifnotequal %}
"imageUrl":"/ueditor/ImageUp/{{ UEditor.imagePath }}",
"imagePath":"{{ MEDIA_URL }}{{ UEditor.imagePath }}",
"scrawlUrl":"/ueditor/scrawlUp/{{ UEditor.scrawlPath }}",
"scrawlPath":"{{ MEDIA_URL }}{{ UEditor.scrawlPath }}",
"imageManagerUrl":"/ueditor/ImageManager/{{ UEditor.imageManagerPath }}",
"imageManagerPath":"{{ MEDIA_URL }}{{ UEditor.imageManagerPath }}",
"catcherUrl":"/ueditor/RemoteCatchImage/{{ UEditor.imagePath }}",
"catcherPath":"{{ MEDIA_URL }}{{ UEditor.imagePath }}",
"fileUrl":"/ueditor/FileUp/{{ UEditor.filePath }}",
"filePath":"{{ MEDIA_URL }}{{ UEditor.filePath }}",
"getMovieUrl":"/ueditor/SearchMovie/"
{% ifnotequal UEditor.options '' %},{{ UEditor.options|safe }}{% endifnotequal %}
});
id_{{UEditor.name}}.render('id_{{ UEditor.name }}');
id_{{UEditor.name}}.addListener('ready',function(){
id_{{UEditor.name}}.setHeight({{ UEditor.height }});
});
</script>
我发现在xadmin中是可以正常加载这段模板的,于是怀疑是否是js的问题,因此在script中加入了几个alert,结果发现在
id_{{UEditor.name}}.render('id_{{ UEditor.name }}');
之后的alert没有弹出,却是是因为js加载的问题。
因此可能的原因是在class Media中声明的静态文件加载顺序比较靠后,导致Ueditor的js代码无法执行,所以我在上面那段模板中加入了
<script type="text/javascript" src="/static/ueditor/editor_config.js"></script>
<script type="text/javascript" src="/static/ueditor/editor_all_min.js"></script>
然后ueditor就可以正常工作了。