今天给大家介绍一个很棒的在线富文本编辑器——UMeditor，它是百度web前端R&D部开发的WYSIWYG富文本WEB编辑器UEditor的迷你版。它轻便，可定制，注重用户体验。它允许自由使用和修改代码，并且适用于前台的快速简单的回复框或后台的内容编辑器。

在线预览源代码下载。

怎么用？

要创建demo.html文件，首先在需要添加编辑器的地方添加以下代码，并使用style设置编辑器的宽度和高度。

脚本类型=' text/plain ' id=' myEditor ' style=' width :98 '；' height:240px'然后，加载与UMeditor相关的js和css文件。相关文件可从本网站下载或直接下载到UMeditor官网下载最新版本。

脚本src=' http :3358 libs . useso.com/js/jquery/2 . 1 . 0/jquery . min . js '/脚本脚本类型=' text/JavaScript ' charset=' utf-8 ' src=' http : umeditor . config . js '/脚本类型=' text/JavaScript ' charset=' utf-8 ' src=' http : umeditor . min . js '/脚本

脚本类型=' text/JavaScript ' var um=um . geteditor(' myEditor ')；/script现在我们可以打开浏览器预览编辑器效果了。

自定义选项

UMeditor提供了丰富的选项设置，用户可以根据自己的项目需求进行自定义。

您可以使用以下代码在编辑器中获取内容，也可以获取纯文本内容。

复制代码如下：um。geteditor('我的编辑器')。getcontent()；

要判断编辑器是否有内容，可以使用以下代码：

var cont=UM.getEditor('myEditor ')。has contents()；If(cont==true){ alert('有内容，'。);}else{ alert ('nothing ')。);}如果将编辑器放入表单并设置动作路径，则可以提交表单并在编辑器中传输内容。例如：

表单操作='server.php '方法='post '脚本id='container '名称='content '类型='text/plain '样式=' width :98 '；' height:240px'在这里写你的初始化内容/script button type=' submit ' class=' BTN ' submit/button/form。我们可以设置工具栏中允许的工具图标。例如，下面是几个常用工具图标的简单定制：

var editor=um . geteditor(' container '，{ toolbar: ['粗体斜体下划线全屏'，' link unlink '，' | justify left justify center justify right justify | '，'情感图像视频|地图']})；UMeditor提供了很多工具，可以根据需求进行定制，如表格编辑、列表布局、多媒体插入、图片上传、地图调用等。UMeditor提供多种语言版本的服务器，主要用于上传图片。用户可以设置上传路径、上传文件类型限制、大小限制等。只要设置它来应用它。