Jquery插件(CKEditor)
描述 在html页面实现像word一样的编辑功能(可视化HTML编辑器)
解决方法
ckeditor插件官方网站 http://ckeditor.com/
使用
1:去官方下载ckeditor插件,添加到项目
2:在页面<head>中引入ckeditor核心文件ckeditor.js
<script type="text/javascript" src="script/ckeditor/ckeditor.js"></script>
3:在使用编辑器的地方插入HTML控件<textarea>
<textarea id="idckeditor" class="ckeditor"></textarea>
4:将相应的控件替换成编辑器代码
<script type="text/javascript"> CKEDITOR.replace('idckeditor');</script>
配置属性
ckeditor的配置都集中在 ckeditor/config.js 文件中
//语言
config.language = 'zh-cn';
// 设置宽高
config.width = 100;
config.height = 100;
// 编辑器样式,有三种:'kama'(默认)、'office2003'、'v2'
config.skin = 'v2';
// 背景颜色
config.uiColor = '#FFF';
// 工具栏(基础'Basic'、全能'Full'、自定义)plugins/toolbar/plugin.js
config.toolbar = 'Basic';
config.toolbar = 'Full';
//工具栏是否可以被收缩
config.toolbarCanCollapse = true;
//工具栏的位置
config.toolbarLocation = 'top';//可选:bottom
//工具栏默认是否展开
config.toolbarStartupExpanded = true;
// 取消 “拖拽以改变尺寸”功能 plugins/resize/plugin.js
config.resize_enabled = false;
//改变大小的最大高度
config.resize_maxHeight = 3000;
//改变大小的最大宽度
config.resize_maxWidth = 3000;
//改变大小的最小高度
config.resize_minHeight = 250;
//改变大小的最小宽度
config.resize_minWidth = 750;
// 当提交包含有此编辑器的表单时,是否自动更新元素内的数据
config.autoUpdateElement = true;
// 设置是使用绝对目录还是相对目录,为空为相对目录
config.baseHref = ''
// 编辑器的z-index值
config.baseFloatZIndex = 10000;
精简ckeditor
在部署到Web服务器上时,下列文件夹和文件都可以删除:
/_samples :示例文件夹;
/_source :未压缩源程序;
/lang文件夹下除 zh-cn.js、en.js 以外的文件(也可以根据需要保留其他语言文件);
根目录下的 changes.html(更新列表),install.html(安装指向),license.html(使用许可);
默认样式设置
ckeditor/style.js 文件中设置默认的样式
参考资料
http://blog.csdn.net/tfy1332/article/details/22648141
效果图
最新文章
- MySQL SQL优化之in与range查询【转】
- 拖拽改变div的大小
- poj 1753 Flip Game 枚举(bfs+状态压缩)
- 在CENTOS6上安装MONGODB
- ios开发之滑动长图截全屏应用
- 获取 Windows 任务栏 Rect
- nginx二级域名配置自动跳转到一级域名
- zTree-已勾选项id传输到action的解决方案
- 爬虫(BeautifulSoup--select--class的选择)
- fs.inotify.max_user_watches默认值太小,导致too many open files
- echo 与 printf的区别与联系
- Python股票分析系列——系列介绍和获取股票数据.p1
- Java面试MySQL的一些问题
- Java笔记 #05# Java Native Interface
- Luogu P4211 [LNOI2014]LCA
- Ambertools15安装(详细)
- 自然语言交流系统 phxnet团队 创新实训 个人博客 (十)
- 【Ctsc2011】幸福路径
- 【git2】git+码云+webStrom
- PAT 甲级 1151 LCA in a Binary Tree