wangEditor富文本编辑器

导读:本篇文章讲解 wangEditor富文本编辑器,希望对大家有帮助,欢迎收藏,转发!站点地址:www.bmabk.com

https://github.com/wangeditor-team/wangEditor

1.引入wangEditor的JS文件,代码如下所示:

<script type="text/javascript" src="//unpkg.com/wangeditor/dist/wangEditor.min.js"></script>

2. 创建富文本编辑框 DOM

<div id="wangEditor"></div>

3. 初始化 wangEditor 对象

<script type="text/javascript">
  // 初始化富文本编辑器 start

  const E = window.wangEditor;
  const editorD = new E("#wangEditor");
  // 设置编辑区域高度为 640px
  editorD.config.height = 640;
  // 配置服务端图片上传地址
  editorD.config.uploadImgServer = "/uploadFiles";
  editorD.config.uploadFileName = "files";
  // 限制图片大小 2M
  editorD.config.uploadImgMaxSize = 2 * 1024 * 1024;
  // 限制一次最多能传几张图片 一次最多上传 5 个图片
  editorD.config.uploadImgMaxLength = 5;
  // 隐藏插入网络图片的功能
  editorD.config.showLinkImg = false;
  editorD.create();
</script>

4. 获取文档内容

var content = editorD.txt.html();

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

文章由极客之音整理,本文链接:https://www.bmabk.com/index.php/post/107544.html

(0)
小半的头像小半

相关推荐

极客之音——专业性很强的中文编程技术网站,欢迎收藏到浏览器,订阅我们!