使用UEditor
在http://ueditor.baidu.com/website/上下载官方文件
文本编辑器的配置文件在ueditor.config.js
需要注意一下几点
首先
var URL = window.UEDITOR_HOME_URL || getUEBasePath();
这里是获取文件的基本安装目录,如果将代码放在服务器上时,发现无法加载下来,可以直接将替换这个地址
替换如下
window.UEDITOR_HOME_URL = "/xxxx/xxxx/";
还有修改工具栏的功能选项
, toolbars:[
['fullscreen', 'source', '|', 'undo', 'redo', '|',
'bold', 'italic', 'underline', 'fontborder', 'strikethrough', 'superscript', 'subscript', 'removeformat', 'formatmatch', 'autotypeset', 'blockquote', 'pasteplain', '|', 'forecolor', 'backcolor', 'insertorderedlist', 'insertunorderedlist', 'selectall', 'cleardoc', '|',
'rowspacingtop', 'rowspacingbottom', 'lineheight', '|',
'customstyle', 'paragraph', 'fontfamily', 'fontsize', '|',
'directionalityltr', 'directionalityrtl', 'indent', '|',
'justifyleft', 'justifycenter', 'justifyright', 'justifyjustify', '|', 'touppercase', 'tolowercase', '|',
'link', 'unlink', 'anchor', '|', 'imagenone', 'imageleft', 'imageright', 'imagecenter', '|',
'insertimage', 'emotion', 'scrawl', 'insertvideo', 'music', 'attachment', 'map', 'gmap', 'insertframe','insertcode', 'webapp', 'pagebreak', 'template', 'background', '|',
'horizontal', 'date', 'time', 'spechars', 'snapscreen', 'wordimage', '|',
'inserttable', 'deletetable', 'insertparagraphbeforetable', 'insertrow', 'deleterow', 'insertcol', 'deletecol', 'mergecells', 'mergeright', 'mergedown', 'splittocells', 'splittorows', 'splittocols', 'charts', '|',
'print', 'preview', 'searchreplace', 'help', 'drafts']
]
这里的功能繁多,可以根据自己的需要修改
有时候我们根据不同的页面,需要的功能不一样,也可以在页面初始化的时候,对这个进行修改
var editor = new baidu.editor.ui.Editor({initialFrameHeight:320,toolbars:[
['fullscreen', 'source', '|', 'undo', 'redo', '|',
'bold', 'italic', 'underline', 'fontborder', 'strikethrough', 'superscript', 'subscript', 'removeformat', 'formatmatch', 'autotypeset', 'blockquote', 'pasteplain', '|', 'forecolor', 'backcolor', 'insertorderedlist', 'insertunorderedlist', 'selectall', 'cleardoc', '|',
'rowspacingtop', 'rowspacingbottom', 'lineheight', '|',
'customstyle', 'paragraph', 'fontfamily', 'fontsize', '|',
'directionalityltr', 'directionalityrtl', 'indent', '|',
'justifyleft', 'justifycenter', 'justifyright', 'justifyjustify', '|', 'touppercase', 'tolowercase', '|',
'link', 'unlink', 'anchor', '|', 'imagenone', 'imageleft', 'imageright', 'imagecenter', '|',
'insertimage', 'emotion', 'scrawl', 'insertvideo', 'music', 'attachment', 'map', 'gmap', 'insertframe','insertcode', 'webapp', 'pagebreak', 'template', 'background', '|',
'horizontal', 'date', 'time', 'spechars', 'snapscreen', 'wordimage', '|',
'inserttable', 'deletetable', 'insertparagraphbeforetable', 'insertrow', 'deleterow', 'insertcol', 'deletecol', 'mergecells', 'mergeright', 'mergedown', 'splittocells', 'splittorows', 'splittocols', 'charts', '|',
'print', 'preview', 'searchreplace', 'help', 'drafts']
]});
editor.render('editor');
工具栏的配置向对应的功能
分组 |
全屏 FullScreen
源代码 Source
撤销 Undo
重做
Redo
加粗 Bold
斜体 Italic
Border
上标 Superscript
下标 Subscript
清除格式
RemoveFormat
引用 BlockQuote
纯文本粘贴模式 PastePlain
文字颜色 ForeColor
背景颜**ackColor
有序列表 InsertOrderedList
无序列表 InsertUnorderedList
下划线
Underline
格式 Paragraph
字体 FontFamily
字体大小 FontSize
从左读
DirectionalityLtr
从右读 DirectionalityRtl
左对齐 JustifyLeft
居中对齐
JustifyCenter
右对齐 JustifyRight
两端对齐 JustifyJustify
添加外连 Link
清除外连
Unlink
添加图片 Image
特殊字符 Spechars
添加表情 Emoticon
添加视频 Video
添加地图
Map
分割线 Horizontal
添加日期 Date
添加时间 Time
删除表格 InsertTable
删除表格
DeleteTable
向表格前插入行 InsertParagraphBeforeTable
向前插入行 InsertRow
删除行
DeleteRow
向前插入列 InsertCol
删除列 DeleteCol
合并多个单元格 MergeCells
向右合并单元格
MergeRight
向下合并单元格 MergeDown
完全拆分单元格 SplittoCells
拆分成行
SplittoRows
拆分成列 SplittoCols
全选 SelectAll
清空文档 ClearDoc
替换查询
SearchReplace
打印 Print
预览 Preview
帮助 Help
使用UEditor的更多相关文章
- 在ASP.NET Core中使用百度在线编辑器UEditor
在ASP.NET Core中使用百度在线编辑器UEditor 0x00 起因 最近需要一个在线编辑器,之前听人说过百度的UEditor不错,去官网下了一个.不过服务端只有ASP.NET版的,如果是为了 ...
- 对百度的UEditor多图片上传的一些补充
我已经写了一篇文章关于百度的UEditor提取多图片上传模块.如果还没有看过,请点击以下链接查看 http://www.cnblogs.com/luke1006/p/3719029.html 出差了两 ...
- 关于百度编辑器UEditor的一点说明
大家在使用的时候要特别注意editor_config.js中的“URL”这个参数 我的理解:1.这个参数是editor整个结构的总路径 2.首先要把这个路径配置好了.才能正常的显示, ...
- UEditor编辑器使用示例
1. UEditor下载 UEditor是由百度web前端研发部开发所见即所得富文本web编辑器,具有轻量,可定制,注重用户体验等特点,开源基于MIT协议,允许自由使用和修改代码. 下载链接:http ...
- ASP.NET MVC5+EF6+EasyUI 后台管理系统(57)-插件---ueditor使用
系列目录 目录: 前言 开发环境 知识点 初始使用 自定义工具栏 设置和读取编辑器内容 文件上传 ueditor加水印 ---------------------------------------- ...
- UEditor百度富文本编辑器--让编辑器自适应宽度的解决方案
UEditor百度富文本编辑器的initialFrameWidth属性,默认值是1000. 不能够自适应屏幕宽度.如图1: 刚开始的时候,我是直接设置initialFrameWidth=null的.效 ...
- UEditor百度富文本编辑器--preview在线预览时头部被挡住的解决方案
问题截图: 正常情况应该是如下显示: 解决方案: 1.打开ueditor/dialogs/preview/preview.html 2.找到body节点下面这一句 document.getElemen ...
- 百度编辑器UEditor与UEditor 公式插件完整Demo
1.下载UEditor(我的是.net项目) 2.下载UEditor公式插件 3.新建解决方案和项目 4.在浏览器中预览index.html页面 结果: 5.index.html源码 <!DOC ...
- Ueditor上传图片后自定义样式类名
Ueditor是百度的一个富文本插件,如果使用者会前端语言的话,那适用性就很好,特别是现在移动端纵横的情况.但往往使用者并不懂编程,要让他们使用前端语言的话是不可能的,这就需要我们在开发时就定义好整个 ...
- easyui与ueditor合用问题
在联合使用easyui与ueditor的时候,当在dialog中通过href打开一个页面,页面中含有ueditor,如果使用dialog的close方法,可以理解为只是将dialog给隐藏了,再将点击 ...
随机推荐
- Windows进程间通信的各种方法
原文:Windows进程间通信的各种方法 进程是装入内存并准备执行的程序,每个进程都有私有的虚拟地址空间,由代码.数据以及它可利用的系统资源(如文件.管道等)组成.多进程/多线程是Windows操作系 ...
- 针对portmap 的DDOS攻击
iptables -I INPUT -p tcp --dport 111 -j DROP iptables -I INPUT -s 10.171.254.221 -p tcp --dport 111 ...
- Linux企业级项目实践之网络爬虫(22)——编写爬虫系统服务控制脚本
需求:1.可通过 service spider start|stop|status|restart 命令对服务进行控制2.spider服务可开机自启动 start() { echo "sta ...
- hdu4622-Reincarnation(后缀自动机)
Problem Description Now you are back,and have a task to do:Given you a string s consist of lower-cas ...
- WPF 控件之ComboBox绑定[2]
最近感觉新的方法Binding comboBox用起来很好用. 记录一下: <ComboBox Grid.Row=" x:Name="cboFamilyName" ...
- 源码分析之struts1自定义方法的使用与执行过程
最近有人问我,你做项目中用户的一个请求是怎么与struts1交互的,我说请求的url中包含了action的名字和方法名,这样就可以找到相应方法,执行并返回给用户了. 他又问,那struts1中有什么方 ...
- Vagrant入门[转]
Vagrant是一个简单易用的部署工具,用英文说应该是orchestration tool.它能帮助开发人员迅速的构建一个开发环境,帮助测试人员构建测试环境. Vagrant的基本工作原理大致如下: ...
- Ubuntu 14.04根据系统,休眠后不能启动要解决的问题
简介: 提升Ubuntu制度14.04之后,当系统进入休眠,我们不能再次启动,直接崩溃,凡出了问题? 1. 问题纳入 Ubuntu升级系统14.04之后.通过系统的Power设置休眠时间,在系统进 ...
- android设备之间屏幕共享
近期公司在开发一款android的设备把屏幕投射到手机上.同一时候手机还能够触控.键盘操作.这样.就达到了屏幕共享的目的. 思考了一下.主要思路: 1.将截图所获取的位图用ffmpeg编码成视频流. ...
- 自定义VS的ItemTemplates 实现任意文件结构
上一篇说到重写IHttpHandler实现前后端分离,这次说一下如何建立一个如下文件结构. VS建立webform时是根据模板来的.C#的模板目录如下: F:\Program Files (x86)\ ...