ueditor的初始化使用

UEditor是由百度开发的富文本web编辑器，它是开源的，允许自由使用和修改。界面相似于word，可方便大家的使用

使用步骤：

       

 1.下载与查看文档：

ueditor完全开源，可在其官方网站下载：http://ueditor.baidu.com/website/index.html

在官网上可以查看ueditor的文档了解它如何使用，阅读API文档来查看命令。

         

2. 源代码的导入：

根据自己所需的版本下载后解压，将得到的文件导入到项目根目录（webapp）下

          

 3. 页面配置：

3.1在head中添加文件的引用

<script type="text/javascript" src="<c:url value="/resources/ueditor/ueditor.config.js" />" ></script>
<script type="text/javascript" src="<c:url value="/resources/ueditor/ueditor.all.min.js" />" ></script>

注意：这两个的顺序不能交换，否则编辑器不能初始化

3.2 在script中编写js

初始化编辑器:

var ue = UE.getEditor('editor');

设置编辑器的初始化内容：

ue.ready(function() {
                //设置编辑器的内容"
                ue.setContent(date);  date为动态传入的数据
               //获取编辑器带格式的内容
               var plain = ue.getPlainTxt();

               //获取编辑器html文本

               var html = ue.getContent();

               //获取编辑器纯文本内容

               var text = ue.getContentText();

            });

3.3配置body

<div>
        <script id="editor" type="text/plain" name="content"  style="width:845px;height:400px;">
                这里也可以直接写固定的文本内容
        </script>
    </div>

         4 编辑器的工具

这个工具列表有好多我们都用不到，需要去除一些不必要的工具。

4.1 方法一

在ueditor.config.js文件中对 toolbars[] 中不需要的工具删掉或注释掉就可以，建议注释掉，万一以后要用到呢。

4.2 方法二

在编辑器实例化的时候传入toolbars参数

toolbars: [
    ['fullscreen', 'source', 'undo', 'redo', 'bold']
    [' ',' ']  一个单引号里面一个工具，几个中括号表示工具栏分为几行，括号内的表示这行的工具
 ]