今天工作需要,用到了Ueditor,在使用的过程中遇到了一些问题,特此在这总结一下,以备以后他人和自己查阅。
首先简单介绍一下,ueditor是百度推出的一款在BSD协议下的完全免费开源的所见即所得的富文本web编辑器,目前的最新版本是1.2.5.1,支持全功能下载(即开发版)以及定制功能下载(即UBuilder版),大家可以到其官方主页看看。
简单的应用配置大家可以下载开发版,里面有非常详细的例子,大约看看就OK,也有详细的API,下面将我遇到的问题与处理方案描述一下:
1、在Asp.net中加载相关脚本文件,并且位置都正确,但是依然显示不出
提示脚本错误 Error: The load /MyWebSite/lang/zh-cn/zh-cn.js fails,check the url settings of file editor_config.js
刚开始以为是我的脚本加载的有问题,检查了一下确实正确,又仔细看了看错误提示,让检查一下editor_config.js中的url
一看才知道原来,在这个config中有一url字段,其直接赋值给UEDITOR_HOME_URL字段,在editor内部的处理中使用了这个UEDITOR_HOME_URL来加载一些内容,这个如果配置不好就会找不到相关的资源,只要我们在配置editor时同时将其赋值就可以,代码如下:
var ue; function pageLoadedFunc() { ue = UE.getEditor('editor', { UEDITOR_HOME_URL: "http://www.cnblogs.com/ueditor/" }); }
这样就可以了。
2、在Asp.net中,通过setContent方法赋值出错。
提示错误:Error: Unable to set property 'innerHTML' of undefined or null reference
定位进去是this.body is undefined。
这个地方实际上是初始时还没对body进行赋值,有两种方式可以解决:
一种是初始的时候使用initialContent进行初始内容赋值,初始完成后,再使用setContent就OK了,如下(顺便介绍另一种初始方案):
var ue; function pageLoadedFunc() { ue = new UE.ui.Editor({ UEDITOR_HOME_URL: "http://www.cnblogs.com/ueditor/", initialContent:"初始内容" }); ue.render("editor"); }
另一种就是使用<%= %>进行赋值
<script id="editor" type="text/plain"><%= styleValue %> </script>
这两种方案都不错,说明一下div或者scritp都可以,只要是个容器就Ok,文档里的'editor'就是容器的id,后台获取可以用过下面的方式获取。
Request.Params["editorValue"];
这里面的editorValue是默认的textarea的ID可以在初始时通过ueditor的textarea字段修改。
好了就写到这里。
转载请注明原创地址。
最后上个图,我只用了其中的部分功能。