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. linux samba 服务器 简单配置

    1. rpm -qa|grep samba 查看是否有samba 2.使用yum -y install samba 安装samba 服务 进入/etc/samba/ 使用vi smb.conf 修改配 ...

  2. python+图像分割seg

    好痛苦 1.目前思路为HOG+SVM 提取HOG时候发现,包装的lib cv2 里有hog算子,但是函数是指针形式.不会用了.. 现在改用推荐的scikits.image , from skimage ...

  3. Sublime Text3开发工具安装emmet插件

    第一步:Sublime Text导入Package Control 自动安装: 1.打开Sublime Text -->View --> Show Console 菜单打开控制台 2.粘贴 ...

  4. 用word-break: break-all解决不正确换行问题

    这个在新闻频道存在已久的问题,今天终于把它给解决了! 问题是这样的,当一段文字中有比较长的链接地址,会造成链接地址之前的文字不能正确换行,效果如下: 对应的html代码如下: <p> 如图 ...

  5. 微软BI 之SSIS 系列 - MVP 们也不解的 Scrip Task 脚本任务中的一个 Bug

    开篇介绍 前些天自己在整理 SSIS 2012 资料的时候发现了一个功能设计上的疑似Bug,在 Script Task 中是可以给只读列表中的变量赋值.我记得以前在 2008 的版本中为了弄明白这个配 ...

  6. 每周一道数据结构(四)A*算法&博弈树α-β剪枝

    A*算法/博弈树 前阵子考试学了A*算法.博弈树和回溯,自己真是愚蠢至极,根本没就搞明白这些,所以对于这些算法问道的话就不能说清楚,也记不住,所以才有了这篇笔记.在这里感谢面试我的那位工程师~~ A* ...

  7. 汇编语言hello world

    DOS下: ;栈段 stack segment stack db dup(?) stack ends ;数据段 data segment szHello db 'Hello,world',0dh,0a ...

  8. Java-基础练习1

    1.      Java为什么能跨平台运行?请简述原理. 因为Java程序编译之后的代码不是能被硬件系统直接运行的代码,而是一种“中间码”——字节码.然后不同的硬件平台上安装有不同的Java虚拟机(J ...

  9. celery简单入门

    写作背景介绍 最近在做后台图像处理,需要使用到celery这个异步任务框架.但是使用的时候遇到很多技术问题,为了方便日后再遇到相似问题时能够快速解决.写下这篇文章也希望能够帮助共同奋战在同一战线的程序 ...

  10. atitit查询表修改表字段没反应--解锁锁定的表

    atitit查询表修改表字段没反应--解锁锁定的表 查询表修改表字段没反应 要是使用gui 没反应,最好使用cmd 方式,不卉不个gui 锁上.. ALTER TABLE t_mb_awardweix ...