2. xhEditor进阶使用
2.1. 进阶使用指导
2.2. 初始化参数列表
2.3. API函数接口列表
2.4. 上传程序开发规范
2.5. 插件开发指南
2.6. 皮肤设计指南
2.7. 关于二次开发
2.1. 进阶使用指导
阅读本章节请先阅读:xhEditor入门基础,若你已经熟悉xhEditor的基本使用,请往下继续。
xhEditor提供两种方式初始化编辑器:
方法1:利用class属性来初始化和传递各种初始化参数,例:
class="xheditor {skin:'default'}"
方法2:利用xhEditor提供的jQuery插件接口来实现对特定textarea的初始化和传递参数,例:
$('#elm1').xheditor();
或者
$('#elm1').xheditor({tools:'mini'});
特别说明:两种初始化方法只能选择其中一种使用,如果两种方法的代码同时存在页面中,方法2的代码不会有任何效果。
我们更倾向于推荐大家使用方法1,因为更简单易用,不涉及任何的Javascript代码。通过简单的参数设置即可定制各种效果的编辑器界面,简单易用且功能强大。
如果想实现更加复杂的交互应用,或者希望xhEditor编辑器能够和自己的Javascript代码实现互相访问,那么你可以选择使用方法2,相对具有更大的自由空间。
xhEditor也提供了即时的卸载编辑器方法:
$('#elm1').xheditor(false);
2.2. 初始化参数列表
初始化参数示例代码:
$('#elm1').xheditor({tools:'full',skin:'default',showBlocktag:true,internalScript:false,internalStyle:false,width:300,height:200,loadCSS:'http://xheditor.com/test.css',fullscreen:true,sourceMode:true,forcePtag:true,upImgUrl:"upload.php",upImgExt:"jpg,jpeg,gif,png"});
初始化参数列表:
tools:自定义工具按钮
参数值:full(完全),mfull(多行完全),simple(简单),mini(迷你)
或者自定义字符串,例如:'Cut,Copy,Paste,Pastetext,|,Source,Fullscreen,About'
完整按钮表:
|:分隔符
/:强制换行
Cut:剪切
Copy:复制
Paste:粘贴
Pastetext:文本粘贴
Blocktag:段落标签
Fontface:字体
FontSize:字体大小
Bold:粗体
Italic:斜体
Underline:下划线
Strikethrough:中划线
FontColor:字体颜色
BackColor:字体背景色
SelectAll:全选
Removeformat:删除文字格式
Align:对齐
List:列表
Outdent:减少缩进
Indent:增加缩进
Link:超链接
Unlink:删除链接
Anchor:锚点
Img:图片
Flash:Flash动画
Media:Windows media player视频
Hr:插入水平线
Emot:表情
Table:表格
Source:切换源代码模式
Preview:预览当前代码
Print:打印
Fullscreen:切换全屏模式
About:关于xhEditor
skin:皮肤风格选择
参数值:default(默认风格),o2007blue(Office 2007 蓝色),o2007silver(Office 2007 银色),vista(Vista),nostyle(NoStyle)
layerShadow:阴影的深度(按钮面板和模式窗口的背景阴影)
参数值:0(不显示阴影),大于0的数值(显示阴影并设置阴影的深度)
clickCancelDialog:点击任意位置取消按钮面板功能
参数值:默认true(开启点击取消功能),false(关闭点击取消功能,必需要点击“取消”按钮才能关闭按钮面板)
showBlocktag:显示段落标签
参数值:true(显示段落标签),false(不显示)
linkTag:样式链接link标签保留状态
参数值:true(保留样式链接link标签),false(清理样式链接link标签)
internalScript:内部JS代码保留状态
参数值:true(保留内部JS代码),false(清理内部JS代码)
inlineScript:内联JS代码保留状态
参数值:true(保留内联JS代码)