wangEditor富文本编辑器

今天看了下文档，记录下。。。

wangEditor开发文档

html：
<div id="editorBox"></div>
<button onclick="confirm()">确定</button>
<div id="content"></div>
js内容：
var E = window.wangEditor
var editor = new E('#editorBox')
//实例化文本编辑器
//1）上传服务器获取网络链接
editor.customConfig.uploadFileName = 'myFile'; //设置文件上传的参数名称
editor.customConfig.uploadImgServer='upload.do'; //设置上传文件的服务器路径（替换你的服务器路径）
editor.customConfig.uploadImgMaxSize = 3 * 1024 * 1024; // 将图片大小限制为 3M
editor.customConfig.uploadImgHooks = {
before: function(xhr, editor, files) {},
success: function(xhr, editor, result) { console.log("上传成功"); },
fail: function(xhr, editor, result) {
console.log("上传失败,原因是" + result); },
error: function(xhr, editor) { console.log("上传出错"); },
timeout: function(xhr, editor) {
console.log("上传超时"); },
customInsert:function(insertImg, result, editor){
var url = result.result[0];
//此处需要改成你自己的返回结果字段
insertImg(url)
}
}
//2）上传使用 base64 保存图片
editor.customConfig.uploadImgShowBase64 = true
//以上方式2选1即可
editor.create()
//创建文本编辑器
function confirm(){
let html =
editor.txt.html();
let text =
editor.txt.text();
console.log(html)
console.log(text)
document.getElementById('content').innerHTML = html;
}

最后

以上就是腼腆季节为你收集整理的wangEditor富文本编辑器的全部内容，希望文章能够帮你解决wangEditor富文本编辑器所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。