7、正文组件

工程代码说明

代码库git地址：http://gitlab.seeyon.com/ctp/ctp-common.git
代码路径说明：
1. /src/main/webapp/common/ckeditor。
2. /src/main/webapp/common/ckeditor413。
代码版本说明：
1. ie8使用ckeditor。
2. ie8以上及其他浏览器使用ckeditor413。
3. 最新代码已合并ckeditor和ckeditor413，即在所有浏览器上都只存在一个版本ckeditor413。

核心代码说明

剪切板（复制/粘贴核心处理代码）：
1. ckeditor-source.js
2. line:12647：CKEDITOR.plugins.add(“clipboard”)处起始行。
3. 重点关注：起line:12686止line:12735。正文数据粘贴过滤处理代码。
编辑器字体/字号添加：
1. config.js。
2. 在font和fomtfamily相关代码中添加。
图像上传/编辑插件：
1. 代码：plugins/image/dialogs/image.js。
复制/粘贴插件：
代码：plugins/pastetools/filter/common.js。

常见问题

正文预览滑动卡顿或者显示不全问题：
1. 原因：iscroll导致。
2. 解决方案：禁用iscroll，使用原生滑动。
  1. 打开mplus-front/src/apps/v5/commons/widget/SeeyonContent-debug.js
  2. 搜索关键字”iscroll”把所有和iscroll相关的代码注释掉。
  3. 找到html代码中滑动的根节点，把overflow:hidden修改成auto，或者添加上overflow:auto代码。
正文预览样式显示错乱问题（内容显示溢出屏幕）：
1. 原因：没有设置宽度导致。
2. 解决方案：将根节点添加width: 100%。
正文预览手机端和PC端字体不一样问题：
1. 原因：手机端没有安装对应的字体导致。
2. 解决方案：无需解决。
正文预览数据显示不全问题（数据问题，非样式问题）：
1. 原因：js中过滤css中值为负数的数据导致。
2. 解决方案：修改过滤数据的正则表达式。
  1. 打开mplus-front/src/apps/v5/commons/widget/SeeyonContent-debug.js
  2. 搜索_preReplace函数。
  3. 把marginPaddingReg正则表达式修改为/(mso-para-)?(margin|padding|text-indent)-\w+:-\d+\.\d+(px|pt|rem|gd);/gi;
正文滑动时会把意见区带着一起滑动问题：
1. 原因：css影响。
2. 解决方案：修改css。
  1. 找到滑动区域的最外层节点。
  2. 添加touch-action: none阻止外层滑动。
粘贴excel中有边框的数据到正文组件中预览时，没有显示黑色边框问题：
1. 原因：css影响。
2. 解决方案：修改css。
  1. 打开ctp-common/src/main/webapp/common/content/content.css文件。
  2. 在文件的底部添加如下代码：
  3. table.cke_show_border,
  4. table.cke_show_border > tr > td,
  5. table.cke_show_border > tr > th,
  6. table.cke_show_border > tbody > tr > td,
  7. table.cke_show_border > tbody > tr > th,
  8. table.cke_show_border > thead > tr > td,
  9. table.cke_show_border > thead > tr > th,
  10. table.cke_show_border > tfoot > tr > td,
  11. table.cke_show_border > tfoot > tr > th {
  12. border: #000 1px solid;
  13. }
正文组件中复制粘贴显示的内容html中span标签嵌套过深问题（表现的现象：正文显示卡顿，ios中部分内容显示不全）：
1. 原因：复制粘贴的插件循环创建样式标签函数执行错误导致。
2. 解决方案：修改JS。
  1. 打开webapps/seeyon/common/ckeditor413/plugins/pastetools/filter/common.js文件。
  2. 找到createStyleStack函数。
  3. 把for循环块注释掉。