1. 导入
js:
ueditor.config.js
ueditor.all.js css/images/plugin:
themes
lang
dialog(可选)
third-party(可选) 2. 配置
修改 ueditor.config.js 的 UEDITOR_CONFIG a. 定义 themes, lang, third-party 的路径,如果是在同一文件夹下,定义 UEDITOR_HOME_URL 就可以了
否则分别修改 themePath, langPath, UEDITOR_HOME_URL
b. 定义工具栏 toolbars
simpleupload : 简单上传:点击按钮,直接选择文件上传
insertimage : 插入图片,会呼起弹窗
c. 其它配置(只列出修改的几条,更多见文档:http://ueditor.baidu.com/doc/)
initialFrameHeight : 编辑器默认高度
enableContextMenu : 右键菜单开关
enableAutoSave : 是否自动保存
topOffset : 工具栏悬浮时 top 值
imageScaleEnabled : 图片压缩开关
elementPathEnabled : 启用元素路径开关
catchRemoteImageEnable : 远程抓取图片开关
iframeCssUrl : 富文本 iframe 中导入的 css 外链文件
wordCount : 字数统计开关
d. 插件
simpleupload : 简单上传:点击按钮,直接选择文件上传
修改上传接口和回调函数,修改接口可以统一在 getActionUrl 中定义,下同
insertimage : 插入图片,会呼起弹窗
修改上传接口和回调函数
autoupload : 拖放文件到编辑区域,自动上传并插入到选区
修改上传接口和回调函数
catchremoteimage : 远程图片抓取,当开启本插件时所有不符合本地域名的图片都将被抓取成为本地服务器上的图片
修改上传接口和回调函数
catcherFieldName : 上传接口中的 form name
catcherLocalDomain : 定义不做替换的图片 domain
e. 自定义按钮
参见:http://fex.baidu.com/ueditor/#dev-developer
3. 遇到的问题
a. 想在富文本中插入一个自定义结构,独立模块,不可编辑,不可部分删除
参考微信公众号,插入一个 iframe,子 iframe 中加 onclick,点击时选中子 iframe(ie, ff 无法选中)
b. 插入图片后只显示一半,编辑器高度没有自动变化,focus 时才撑高
插入图片后 fire: me.fireEvent("contentchange");
c. simpleupload 没有 title
找到 initUploadBtn ,给 input 加个 title
d. 想在工具栏和富文本 iframe 中间插入一些内容
参考微信公众号,在 EditorUI.prototype 的 getHtmlTpl 中插入
e. http 请求多个 css 文件,而且是用 js 异步加载的,会出现临时样式不对的情况
将需要的 css 合并压缩成一个文件,在 head 引入,去掉 UE.ui.Editor 中用 js 引入 css 的部分
f. 在 IE 下 iframeCssUrl 指定的文件加载了,但竟然不生效也是醉了
直接在 Editor.prototype 的 render 中写入样式

  

使用ueditor小结的更多相关文章

  1. 百度富文本ueditor使用小结

    最近因工作需要使用了ueditor,根据自己的需求将开发使用时遇到的问题小结分享下. 1.可到官网根据自身情况下载最新版本,https://ueditor.baidu.com/website/ 2.h ...

  2. ueditor使用小结

    一.简介 ueditor是百度编辑器,官网地址:http://ueditor.baidu.com/website/ 完整的功能演示,可以参考:http://ueditor.baidu.com/webs ...

  3. ueditor使用小结【来源网络】

    原文地址:http://www.cnblogs.com/janes/p/5072496.html ueditor是百度编辑器,官网地址:http://ueditor.baidu.com/website ...

  4. Node + Express + Mysql的CMS小结

    因为之前用过上述的组合完成过很多系统,而这一次是为了实现一个帮助系统的静态网页发布.因为很久不写,重点说遇到的几个坑: 1.库版本的问题 比如mysql连接数据库一直报错,因为系统重装过,所以重新安装 ...

  5. ueditor编辑器使用总结

    ueditor使用小结 一.简介 ueditor是百度编辑器,官网地址:http://ueditor.baidu.com/website/ 完整的功能演示,可以参考:http://ueditor.ba ...

  6. Ueditor设置默认字体、字号、行间距,添加字体种类(转)

    Ueditor默认字体.字号.行间距的修改: ueditor默认字号是16号,默认字体为sans-serif,默认行间距为5px,如下图所示: 首先,修改ueditor.all.js文件中如上图红框中 ...

  7. Java-Maven项目引入UEditor图片上传组件jar包类库的5种方式

    最近,硬是和百度的UEditor组件杠上了.自己的个人官网项目,很容易就搞定了,公司的项目,尼玛,各种问题.项目多了,环境复杂了,解决问题的方法也得不断调整. 项目用Maven管理jar包,用到了UE ...

  8. springboot+layui 整合百度富文本编辑器ueditor入门使用教程(踩过的坑)

    springboot+layui 整合百度富文本编辑器ueditor入门使用教程(踩过的坑) 写在前面: ​ 富文本编辑器,Multi-function Text Editor, 简称 MTE, 是一 ...

  9. springboot整合ueditor实现图片上传和文件上传功能

    springboot整合ueditor实现图片上传和文件上传功能 写在前面: 在阅读本篇之前,请先按照我的这篇随笔完成对ueditor的前期配置工作: springboot+layui 整合百度富文本 ...

随机推荐

  1. ManyToMany【项目随笔】关于异常object references an unsaved transient instance

    在保存ManyToMany  时出现异常: org.springframework.dao.InvalidDataAccessApiUsageException: org.hibernate.Tran ...

  2. phpcms开启、关闭在线编辑模板的方法

    打开 caches/configs/system.php 文件 找到 'tpl_edit'=> 0,//是否允许在线编辑模板 修改此行代码中的数字为 1或0 即可

  3. 使用OpenCV3处理图像

    不同色彩空间的转换 当前,在计算机视觉中有三种常用的色彩空间:灰度.BGR.以及HSV(Hue,Saturation,Value) 灰度色彩空间是通过去除彩色信息来将其转换成灰阶,灰度色彩空间对中间处 ...

  4. [转] Linux中启动和停止jar包的运行

    脚本一: startTest.sh内容如下:#!/bin/shjava -jar Test.jar &       #注意:必须有&让其后台执行,否则没有pid生成echo $! &g ...

  5. OGLplus 0.33.0 发布,OpenGL 的 C 封装库

    OGLplus 0.33.0 引入很多新的 OGLplus 和 OALplus 示例,更新了构建系统.CamMatrix::LookingAt 构造器.Texture::MaxLevel getter ...

  6. C#中 ToString 和 override ToString 的区别

    public class p { public string ToString(){ return "p"; } } public class c:p{ public string ...

  7. Linux 进程间通信(二) 管道

    Linux 进程间通信-管道 进程是一个独立的资源分配单位,不同进程之间的资源是相互独立的,没有关联,不能在一个进程中直接访问另一个进程中的资源.但是,进程不是孤立的,不同的进程之间需要信息的交换以及 ...

  8. tomcat通过conf-Catalina-localhost目录发布项目详解

    Tomcat发布项目的方式大致有三种,但小菜认为通过在tomcat的conf/Catalina/localhost目录下添加配置文件,来发布项目,是最佳选择. 因为这样对tomcat的入侵性最小,只需 ...

  9. sql server创建备份计划

    对于备份计划,在sql server中微软提供了相应的功能集,通过Maintenance Plans向导可以对数据库进行相关维护工作. 通过下图的向导,可以进行如定期备份和清除工作. 前提是安装介质包 ...

  10. Liferay7 BPM门户开发之29: 核心kernel.util包下面的通用帮助类ParamUtil、GetterUtil使用

    与其闭门造车,不如直接开动原装.进口.免费的法拉利. -- 作者说 不多说废话,直接上代码. ParamUtil ParamUtil.GetterUtil是Liferay最重要的帮助类 ParamUt ...