道招
锅巴匆匆
记录CKEditor4删除文本引起文本分割而升级版本的经历
背景 前段时间对接了一个electron壳提供功能————拼写检查，也就是在输入的英文有问题的时候，给予红色波浪线提示，邮件的时候能出现候选词，选择候选词后进行替换。 在功能上线当天上午产品经理发现邮件的富文本编辑器CKEditor内部分场景无法正常简写拼写替换。。。 问题复现 我们输入正确的英文单词 Successfully ，此时不会有红色波浪线，符合预期，但是如果此时在中间
锅巴匆匆
CKEditor系列（七）编辑器工具栏根据宽度自动折叠
刚才看了看上一篇写CKEditor的文章是在今年的一月份，现在轮到我们的设计师对编辑器下手了。我们回顾下现在的编辑器长什么样子。 需求 我们客户端默认窗口尺寸下，会出现排，并且第二排的这些功能使用频次相对较低，为了尽可能的增大用户的操作区域，所以决定做如下改动： 将居左对齐、居中对齐、居右对齐改成三合一的功能 将频次使用率低的有序列表和无序
锅巴匆匆
2021年的一点工作总结（二）富文本编辑器
邮件项目的核心功能就是编辑邮件了，所以文本的编辑特别容易被用户吐槽了。用户报障的时候一个万能的吐槽点“没有xxx功能，不支持xxx，没有Outlook好用”。 其实作为一个web产品，如果需要更加公平的对比的话，应该远程web版网页邮箱对比（如outlook网页版），而不是客服端软件（如Outlook），普通用户不知道也不会这么对比，所以你也只能受着。。。 从原来的wangEditor替换成CK
锅巴匆匆
CKEditor富文本编辑器职责分离
背景 CKEditor富文本 编辑器 （生产版本1.1.1及以前）里面包含富文本基础插件及当前最新的邮件特定的业务插件（签名、快捷回复、邀评、默认样式、选择颜色、插入图片、粘贴模式） O端 ，作为业务项目，具体使用编辑器。 O端 + 编辑器 组合起来作为完整的项目运行。 图中 红框 内标注插件为原编辑器不支持而全新开发的 图中 蓝框 内标注插件为原编辑器还有类似插件
锅巴匆匆
富文本编辑器CKEditor4迁移方案
之前写过 《富文本编辑器wangEditor迁移CKEditor前后效果对比》 ，结合大家的反馈后进行了调整。 增加了具体案例的展示CKEditor插件和事件系统，重新整理成迁移方案。 一、背景 老版本富文本编辑器wangEditor的工具栏如图所示 新版本富文本编辑器CKEditor4工具栏如图所示 老版本编辑器有以下常见业务场景不支持： 先设置字体字号
锅巴匆匆
CKEditor自动加载内联编辑器引发的故障记录
在一次项目优化过程中，我采取了按需加载的策略，将对CKEditor入口JS文件的加载过程移动到了点击回复邮件之后，这样的话，当用户没有编辑邮件的需求时就不用加载CKEditor相关的JS文件了。但是因为这一个改动，引起了意想不到的问题。 因为我们的项目中IM聊天页面也用到了简易的富文本编辑，使用的也是contenteditable的div来实现的，问题也是因此而出现的。我们先简单介绍下CKE
锅巴匆匆
CKEditor系列（六）改造原编辑器默认样式dom结构效果对比
熟悉的朋友应该知道之前是用的wangEditor，近期才迁移到CKEditor，很早的时候项目就支持一个叫“默认样式”的功能，需求就是部分BU希望能够统一邮件对外发送的样式，比如统一使用“宋体，黑色，18px”。 之前在wangEditor上是这么实现的 <p class="default-email-style" style="margin
锅巴匆匆
CKEditor系列（五）编辑器内容的设置和获取过程
我们看一下CKEditor4的编辑器内容的设置和获取过程，也就是setData和getData过程。 我们在调用 editor.setData 的时候，调用的就是 core/editor.js 里面的 setData 方法。 // src/core/editor.js setData: function( data, options, internal ) { var fire
锅巴匆匆
富文本编辑器wangEditor迁移CKEditor前后效果对比
一、背景 富文本编辑器wangEditor的工具栏如图所示 富文本编辑器CKEditor4工具栏如图所示 二、wangEditor编辑器存在问题 1. 字号和字体设置不友好 客服反馈无法快速通过工具栏图标找到设置字号、字体的功能 老版编辑器设置字体（或字号）与许多主流编辑器及Office软件操作有所不同，不支持先设置字体（或字号）再进行输入文字，只能先选中
锅巴匆匆
CKEditor系列（四）支持动态多语言i18n
多语言文件结构 先看下CKEditor4的多语言文件长什么样子 //src/lang/zh-cn.js CKEDITOR.lang[ 'zh-cn' ] = { editor: '所见即所得编辑器', common: { editorHelp: '按 ALT+0 获得帮助&
关注道招网公众帐号
消息推送
道招网关注互联网，分享IT资讯，前沿科技、编程技术，是否允许文章更新后推送通知消息。
允许
不用了