现在的位置: 首页 > web前端 > 正文

UMeditor强大的富文本编辑器

2020年07月06日 web前端 ⁄ 共 885字 ⁄ 字号 评论关闭

  UMeditor,简称UM,是ueditor的简版。是为满足广大门户网站对于简单发帖框和回复框的需求,专门定制的在线富文本编辑器。我们的目标不仅是要提高在线编辑的编辑体验,也希望能改变前端技术中关于富文本技术的门槛,让大家不再觉得这块是个大坑。


  UMeditor主要特点


  轻量:主文件的代码量为139k。


  加载速度更快:放弃了使用传统的iframe模式,采用了div的加载方式,以达到更快的加载速度和零加载失败率。


  可定制:配置项完善,可定制程度高。


  可扩展:代码层次拆分清晰,功能以插件形式挂接,可灵活定制需要的功能。


  多后台支持:支持php、asp、jsp、.net四种后台部署代码


  功能丰富:支持插入公式、粘贴QQ截屏、拖放上传图片、插入地图、草稿箱功能


  UMeditor入门部署和体验


  第一步:下载编辑器


  到官网下载umeditor最新版源码版本,下载之后打开_examples/index.html就可以看到演示例子。


  第二步:部署编辑器到页面


  解压下载的包,放到你的项目中。在你的页面要插入编辑器的位置,插入代码:


  <!--加载编辑器的容器-->


  <scriptid="container"name="content"type="text/plain">


  这里写你的初始化内容


  </script>


  在<head></head>标签最后,插入需要引用的文件和实例化编辑器的代码(注意修改引用文件的路径),其中:UM依赖jquery和etpl,注意引入文件的顺序


  <!--样式文件-->


  <linkrel="stylesheet"href="./umeditor/themes/default/css/umeditor.css">


  <!--引用jquery-->


  <scriptsrc="./umeditor/third-party/jquery.min.js"></script>


  <!--引入etpl-->


  总之,UMeditor部署完成,这时候你再浏览器打开你的页面,看到下面这样的编辑器,说明你已部署成功

【上篇】
【下篇】

抱歉!评论已关闭.