参考资料

  1. UEditor 二次开发富文本编辑器
  2. Open Web Analytics (OWA)
  3. Apache Druid是一个高性能的实时分析数据库,专为快速查询和摄取大规模数据而设计
  4. OneNav 是一款开源的书签导航工具
  5. Sigil是一个开源的电子书编辑工具
  6. Docker 部署 Umami 教程
  7. RuoYi AI 是一套基于人工智能技术的开源系统
  8. 仓颉JWT是一个基于Java的轻量级JSON Web Token(JWT)库

UEditor 二次开发富文本编辑器

UEditor 二次开发富文本编辑器

简介

UEditor 是由百度前端团队开发的富文本编辑器,基于 JavaScript,支持多浏览器,提供丰富的文本编辑功能,可嵌入网页使用。

最新更新时间

2023年(官方维护已停止,但社区仍有更新)

新增功能(社区版)

  1. 支持 Markdown 编辑模式

  2. 优化图片上传(支持粘贴上传)

  3. 增强表格编辑功能

  4. 适配移动端编辑

  5. 修复已知安全漏洞


主要功能

文本编辑:加粗、斜体、下划线、字体、字号、颜色
段落排版:对齐方式、缩进、列表(有序/无序)
多媒体插入:图片、视频、音频、表格、链接
代码高亮:支持多种编程语言
全屏编辑:最大化编辑区域
自动保存:防止内容丢失
多语言支持:中文、英文等


下载方式

  1. 官方 GitHub(已归档,可下载历史版本):
    https://github.com/fex-team/ueditor

  2. 社区维护版(推荐):
    https://github.com/ueditorx/ueditor


语法说明

1. 基础调用

var editor = UE.getEditor('editorContainer');

2. 自定义配置

UE.getEditor('editorContainer', {
    toolbars: [
        ['bold', 'italic', 'underline'],
        ['insertimage', 'insertvideo']
    ],
    autoHeightEnabled: false,
    initialContent: '默认内容'
});

3. 常用方法

方法说明
getContent()获取编辑器 HTML 内容
setContent(html)设置编辑器内容
destroy()销毁编辑器实例
focus()让编辑器获取焦点

安装示例

1. 引入 JS 文件

<script src="ueditor.config.js"></script>
<script src="ueditor.all.min.js"></script>

2. 添加编辑器容器

<div id="editorContainer" style="width: 800px; height: 400px;"></div>

3. 初始化编辑器

<script>
    var editor = UE.getEditor('editorContainer');
</script>

二次开发建议

🔹 修改配置:调整 ueditor.config.js
🔹 自定义插件:扩展新功能(如 Markdown 支持)
🔹 UI 优化:修改 CSS 适配项目风格
🔹 安全增强:过滤 XSS 攻击,限制上传文件类型


注意事项

官方已停止维护,建议使用社区版或替代方案(如 TinyMCE、CKEditor)
兼容性问题:部分新浏览器可能不支持旧版 UEditor
安全性:需自行处理 XSS 防护