富文本编辑器CKEditor4迁移方案 富文本编辑器导入word
csdh11 2024-12-25 10:52 2 浏览
之前写过《富文本编辑器wangEditor迁移CKEditor前后效果对比》，结合大家的反馈后进行了调整。 增加了具体案例的展示CKEditor插件和事件系统，重新整理成迁移方案。
一、背景
老版本富文本编辑器wangEditor的工具栏如图所示
新版本富文本编辑器CKEditor4工具栏如图所示
老版本编辑器有以下常见业务场景不支持：
- 先设置字体字号，然后再编辑文字
- 格式刷
- 表格粘贴至编辑器后增删表格行、列 新版本富文本编辑器内置插件直接支持上述功能。
二、新版编辑器的优势
我们能够将不同的业务场景写成插件，同时可以通过调整插件监听事件的优先级来干预（或部分借用）内置插件的结果。
场景举例
默认情况下向编辑器内粘贴图片操作会直接插入编辑器内，但是我们需要用户在粘贴图片的时候，显示一个二次确认弹框，提示用户选择是直接将该图片粘贴到编辑器内或者上传为附件使用。
改进方案
我们的自定义插件可以通过设置合适的优先级借用内置插件的准备流程同时避免原处理流程中其它可能干扰结果的处理回调。
三、新版编辑器的特性
可以通过配置项组合成不同的过滤器，对编辑器内容的获取结果进行控制。
案例
灰度期间客服反馈新版编辑器正在编辑的内容显示正常，内容发送出去后存在"增加空行的情况"，
原因：调用接口是会调用CKEditor的getData方法获取编辑器内容，该方法中CKEditor会将空标签（例如<div></div>）内加入空行 ，从而导致原来高度为0的空标签有了高度，和编辑时显示的效果不一致，发送的内容在视觉上就感觉是“增加了空行”。
鉴于邮件内容来源不可控，无法避免外部邮件可能存在空标签的情况，在参考官网及网上设置了多种不同的配置项后，仍未达到理想的效果，我们的自定义过滤器暂时直接原样返回innerHTML内容作为输出结果。
相关推荐
- SpringBoot集成grpc实现微服务 springboot集成weblogic
-
前言传统的SpringCloud实现微服务的方案中，我们通常都是使用SpringCloudOpenFeign组件以RESTFULAPI的调用方式来完成微服务之间的RPC调用；使用RESTFULA...
- 使用RealESRGAN制作本地图片变清晰脚本
-
不知道这个以前，想让图片变清晰要不使用手机上的美图秀秀，要不使用网页，非常麻烦，这个就非常方便了，不必担心隐私泄露，如果实在担心，虚拟机里面断网运行它。下载RealESRGANhttps://gith...
- AndroidStudio_Android使用OkHttp发起Http请求
-
这个okHttp的使用,其实网络上有很多的案例的,但是,如果以前没用过,copy别人的直接用的话,可以发现要么导包导不进来,要么,人家给的代码也不完整,这里自己整理一下.1.引入OkHttp的jar...
- 避免用Apache Beanutils进行属性的copy。why?让我们一起一探究竟
-
在实际的项目开发中，对象间赋值普遍存在，随着双十一、秒杀等电商过程愈加复杂，数据量也在不断攀升，效率问题，浮出水面。问：如果是你来写对象间赋值的代码，你会怎么做？...
- Mysql最全笔记，快速入门，干货满满，爆肝
-
目录一、MySQL的重要性二、MySQL介绍三、软件的服务架构四、MySQL的安装五、SQL语句六、数据库相关（DDL）七、表相关八、DML相关（表中数据）九、DQL（重点）十、数据完...
- Flume日志采集系统--初体验 flume:构建高可用、可扩展的海量日志采集系统
-
这两天看了一下Flume的开发文档，并且体验了下Flume的使用。本文就从如下的几个方面讲述下我的使用心得：初体验——与Logstash的对比安装部署启动教程参数与实例分析Flume初体验Flume...
- 用Python开发GUI实战教程:图片转换素描画工具
-
python作为胶水语言，它几乎是无所不能的，但个人一直觉得在GUI开发方面，python可以算作是短板了，为什么？因为性能…python的性能问题，往往出现在其他编程语言对其的鄙夷中。但不管如何py...
- java面试之基础(面试不要错过哦) java面试大全及答案
-
java基础面试题1.jre，jdk，jvm之间的区别是什么？2.Java中一个char类型是否可以存储一个汉字？3.Java的数据类型？4.自动类型转换规则是什么？5.运算符优先级顺序是什么？6.i...
- IntelliJ IDEA与Eclipse中lombok插件的安装和使用
-
IntelliJIDEA与Eclipse中lombok插件的安装和使用...
- 魔兽世界9.1 刻希亚寻找宝箱、稀有WA(转自nga)
-
WA导入后，一旦你进入刻希亚，WA就会自动提示宝箱、稀有怪物位...
- Java安全编码军规 javascript安全编码
-
规则1：对外部输入必须进行严格校验【说明】软件最为普遍的缺陷就是对来自客户端或者外部环境的数据没有进行正确的合法性校验。这种缺陷可以导致几乎所有的程序弱点，例如Dos、命令注入、SQL注入、数据破坏、...
- SpringBoot实现MySQL数据库自动备份管理系统
-
最近写了一个MySQL数据库自动、手动备份管理系统开源项目，想跟大家分享一下，项目地址：https://gitee.com/asurplus/db-backup...
- Java微服务实现商城系统架构设计与实现(业务,规划,设计,实现)
-
Java微服务实现商城系统架构设计与实现(业务,规划,设计,实现)目录...
- JMicro微服务Hello World 微服务 web
-
概述JMicro是本人开发的基于Java实现的微服务框架，前两天发布0.0.3正式版本，并已发布到maven中央仓库。项目源码github：https://github.com/mynewworldy...
- 一周热门
-
-
IDC机房服务器托管可提供的服务
-
新版腾讯QQ更新Windows 9.9.7、Mac 6.9.25、Linux 3.2.5版本
-
一文看懂mysql时间函数now()、current_timestamp() 和sysdate()
-
详解PostgreSQL 如何获取当前日期时间
-
一款全能的看图软件，速度快、功能强、免费用
-
PhotoShop通道
-
Boston Dynamics Founder to Attend the 2024 T-EDGE Conference
-
一文读懂关于MySQL Datetime字段允许插入0000-00-00无效日期
-
Serv-u 提权
-
流星蝴蝶剑:76邵氏精华版，强化了流星，消失了蝴蝶
-
- 最近发表
-
- SpringBoot集成grpc实现微服务 springboot集成weblogic
- 使用RealESRGAN制作本地图片变清晰脚本
- AndroidStudio_Android使用OkHttp发起Http请求
- 避免用Apache Beanutils进行属性的copy。why?让我们一起一探究竟
- Mysql最全笔记，快速入门，干货满满，爆肝
- Flume日志采集系统--初体验 flume:构建高可用、可扩展的海量日志采集系统
- 用Python开发GUI实战教程:图片转换素描画工具
- java面试之基础(面试不要错过哦) java面试大全及答案
- IntelliJ IDEA与Eclipse中lombok插件的安装和使用
- 魔兽世界9.1 刻希亚寻找宝箱、稀有WA(转自nga)
- 标签列表
-
- serv-u 破解版 (19)
- huaweiupdateextractor (27)
- thinkphp6下载 (25)
- mysql 时间索引 (31)
- mydisktest_v298 (34)
- sql 日期比较 (26)
- document.appendchild (35)
- 头像打包下载 (61)
- oppoa5专用解锁工具包 (23)
- acmecadconverter_8.52绿色版 (39)
- oracle timestamp比较大小 (28)
- f12019破解 (20)
- np++ (18)
- unity shader入门精要pdf (22)
- word文档批量处理大师破解版 (36)
- pk10牛牛 (22)
- server2016安装密钥 (33)
- mysql 昨天的日期 (37)
- 加密与解密第四版pdf (30)
- pcm文件下载 (23)
- jemeter官网 (31)
- parsevideo (33)
- 个人网站源码 (37)
- ckeditor4中文文档 (27)
- exe4j_java_home (30)