简洁富文本编辑器wangEditor解析
程序员文章站
2024-02-24 23:15:28
简洁富文本编辑器wangeditor
创建方式有两种,非常简单
第一种:直接创建
html:
欢迎使用 wangeditor 富文本编辑器
js: // 引用 var e = requi...
简洁富文本编辑器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()
推荐阅读
-
简洁富文本编辑器wangEditor解析
-
KindEditor 4.1.4 发布,在线富文本编辑器
-
在项目中使用富文本编辑器UEditor(开源文本编辑器插件)
-
kindEditor富文本编辑器 设置图片最大宽度为100%
-
富文本编辑器--设置和获取内容
-
vue项目集成富文本编辑器CKEditor4
-
ThinkPHP示例:强大的Ueditor富文本编辑器
-
Python的Flask框架中集成CKeditor富文本编辑器的教程
-
富文本编辑器UEditor的安装配置,及PHP版本服务器端上传设置
-
关于富文本编辑器—UEditor(java版)的使用,以及如何将UEditor的文件/图片上传路径改成绝对路径