由于在网站开发中需要用到富文本编辑器,我通过查找资料研究了一套简单的富文本编辑器的开发方法。
这是本编辑器的源代码(未包含插件)。
配套教程:http://www.effity.com/article2
查看示例效果:http://effity.com/static/richtext_editor/editor.html
在兼容性上,我测试了4个浏览器:Internet Explorer, Edge, Firefox, Chrome的当前最新版本。
对于低版本的这四种浏览器或其他浏览器,暂不能保证它的功能完备。
本编辑器使用了一些外部插件来实现部分功能,其中包括:
- 基础框架jQuery,官网:http://jquery.com/
- 漂浮窗口使用到了jQuery UI的拖拽效果,官网:https://jqueryui.com/
- 跨浏览器选区插件rangy,GitHub项目:https://github.com/timdown/rangy
- 数学公式渲染插件MathJax,官网:https://www.mathjax.org/
- 高亮代码插件highlight.js,官网:https://highlightjs.org/