当前位置： 移动技术网 > IT编程>网页制作>CSS > 简洁富文本编辑器wangEditor解析

简洁富文本编辑器wangEditor解析

2018年12月06日  | 移动技术网IT编程  | 我要评论

简洁富文本编辑器wangeditor

创建方式有两种,非常简单

第一种:直接创建

html:

欢迎使用 wangeditor 富文本编辑器

js: // 引用 var e = require('wangeditor') // 使用 npm 安装 var e = require('/wangeditor.min.js') // 使用下载的 // 创建编辑器 var editor = new e('#editor') editor.create()

第二种：功能栏和编辑窗口分开创建

 

中间隔离带

请输入内容

<script type="text/javascript" src="/wangeditor.min.js"></script><script type="text/javascript"> var e = window.wangeditor var editor1 = new e('#p1', '#p2') // 两个参数也可以传入 elem 对象，class 选择器 editor1.create() </script>

这里的引用只需要引用wangeditor.min.js或者wangeditor.js中的一个就行了,css不用引入

禁用编辑功能：

editor.$textelem.attr('contenteditable', false)

设置内容：

editor.txt.html('

用 js 设置的内容

')

获取内容：

editor.txt.html()

追加内容：

editor.txt.append('

追加的内容

')

清空内容：

editor.txt.clear()

您可能感兴趣的文章:

如对本文有疑问， 点击进行留言回复！！

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网