富文本编辑器——wangeditor使用

92 阅读 0 评论 61 点赞

我是靠谱客的博主光亮海燕，这篇文章主要介绍富文本编辑器——wangeditor使用，现在分享给大家，希望可以做个参考。

最近在该系统bug，用户希望把一个表单换成富文本编辑器，奈何自己是小白，第一次上手，所以做起来有点困难，一开始使用百度的ueditor，但是，保存的时候一直提示file is not present，在网上找方法也解决不了，后来放弃了，选择wangeditor,

下面是步骤：

1、下载

官网：wangEditor.github.io；

2、把下载的压缩包放在项目的static下面：

3、就是页面使用了

①、首先引入css和js文件：

②、实例

复制代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<script type="text/javascript">
var editor = new wangEditor('editor');<!--名字与后面的id内容一致-->

// 上传图片

editor.config.uploadImgUrl = '/upload';
editor.config.uploadParams = {};
editor.config.uploadHeaders = {}
editor.config.emotionsShow = 'icon';
editor.config.emotions = {
'default': {
title: '默认',
data: 'static/js/wangEditor/emotions.data'

},
editor.create();
$(".wangEditor-txt").height(300);
</script>