当前位置: 首页 > 图文教程 > 网络编程 > 网页编辑器 > 将CKfinder 整合进 CKEditor3.0的方法

网页编辑器
FCKeditor 2.0 简化和使用
jsp fckeditor 上传中文图片乱码问题的解决方法
IE8 Fckedit2.6.X不兼容
fckeditor php上传文件重命名的设置
FCKeditor 新闻组件的一些程序漏洞
FckEditor 配置手册中文教程详细说明
Windows Live Writer 实现代码高亮
FckEditor 中文配置手册详细说明
FCKEidtor 自动统计输入字符个数(IE)
nicedit 轻量级编辑器 使用心得
FCKEditor 表单提交时运行的代码
FCKeditor 插件开发 示例(详细版本)
fckeditor 插件实例 制作步骤
fckeditor 插件开发参考文档
fckeditor 常用函数
FCKeditor ASP.NET 上传附件研究
FCKEditor SyntaxHighlighter整合实现代码高亮显示
HTML 编辑器 FCKeditor使用详解
fckeditor 代码语法高亮
eWebEditor 辑器按钮失效 IE8下eWebEditor编辑器无法使用的解决方法

网页编辑器 中的 将CKfinder 整合进 CKEditor3.0的方法


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2010-01-10   浏览: 396 ::
收藏到网摘: n/a

CKFinder是一款基于AJAX的文件浏览器,这是ASP.NET专用版,它可以在线浏览文件、管理文件、上传文件,以树形Tree的方式展开目录,自动检测图片并生成缩略图,它是由Fckeditor公司出品,同时也可配合FckEditor来使用,可达到意想不到的效果。
由于本次CKEditor全新改版,没有提供文件上传功能,所以选择整合CKFinder是个不错的选择
需要修改一下CKEditor插件文件夹下的JS源码,以image插件为例(Flash及Files同理):
Code
复制代码 代码如下:

//将下边的代码做一些修改
//{type:'button',id:'browse',align:'center',label:m.lang.common.browseServer,hidden:false,filebrowser:'info:txtUrl'}]}]},
//2009-07-13 将浏览服务器按钮置为显示状态 (hidden: false),增加onClick函数,用于打开ckfinder页面
{ type: 'button', id: 'browse', align: 'center', label: m.lang.common.browseServer, hidden: false, filebrowser: 'info:txtUrl', onClick: function() { var finder = new CKFinder(); finder.BasePath = '../ckfinder20090716/'; finder.SelectFunction = SetFileField; finder.Popup(); } }]}]},

在方法体外增加下边的函数
//2009-07-13 杨鑫增加 用于取回 ckfinder 返回的图片地址并对路径文本框和预览图片进行赋值
function SetFileField(fileUrl)
{
//获取主Div下的所有文本框控件
var inputStr = document.getElementById("cke_txtContent_dialog").getElementsByTagName("Input");
for(var i=0; i<inputStr.length; i++)
{
if(inputStr[i].type=="text")
{
//第一个输入框控件是图像路径,得到ID,设置新的图片路径
CKEDITOR.document.getById(inputStr[i].id).setValue(fileUrl);
break ;
}
}
CKEDITOR.document.getById('previewImage').setAttribute('src', decodeURI(fileUrl));
}