wangEditor官网

wangEditor官方文档

wangEditor官方下载

下载好之后找到wangEditor.js文件。然后引入进去。以下是我使用的一些功能

<!DOCTYPE html><html><head><meta charset="UTF-8"><title>wangEditor demo</title></head><body><button id="btn1">BOTTON</button><div id="editor"><p>欢迎使用 <b>wangEditor</b> 富文本编辑器</p></div><script type="text/javascript" src="/wangEditor.min.js"></script><script type="text/javascript">var E = window.wangEditorvar editor = new E('#editor')// 或者 var editor = new E( document.getElementById('editor') )// 自定义菜单配置editor.customConfig.menus = ['head', // 标题'bold', // 粗体'fontSize', // 字号'fontName', // 字体'italic', // 斜体'underline', // 下划线'strikeThrough', // 删除线'foreColor', // 文字颜色'backColor', // 背景颜色'list', // 列表'justify', // 对齐方式'quote', // 引用'image', // 插入图片'undo', // 撤销'redo' // 重复];//上传图片接口editor.customConfig.uploadImgServer = '/api/upload/upload_images_desc.html';editor.create();editor.txt.html('<p>用 JS 设置的内容</p>');//点击按钮获取对应内容document.getElementById('btn1').addEventListener('click', function () {var json = editor.txt.getJSON() // 获取 JSON 格式的内容var jsonStr = JSON.stringify(json)console.log(json)console.log(jsonStr)console.log(editor.txt.html()) //获取内容})</script></body></html>

上传图片接口的返回值格式

{// errno 即错误代码，0 表示没有错误。// 如果有错误，errno != 0，可通过下文中的监听函数 fail 拿到该错误码进行自定义处理"errno": 0,// data 是一个数组，返回若干图片的线上地址"data": ["图片1地址","图片2地址","……"]}

具体请参考刚放文档，不具体细说了！！！！哈哈哈哈

本内容不代表本网观点和政治立场，如有侵犯你的权益请联系我们处理。