页面导航：
→ 正文内容 ckeditor ckfinder
整合ckeditor+ckfinder，解决上传文件路径问题
现在fckeditor已经改名为ckeditor，上传控件也分离为ckfinder，按照说明文档的默认配置会出现上传路径不正确的情况，因为我们的网站可以通过定义默认网站、虚拟目录、以及放在网站的子目录下进行访问
这三种情况下所得到的server.MapPath是一致的，这就导致上传之后写入数据库的图片地址和实际图片存储地址不一致，因此，我们需要自定义一个路径地址userDir，让baseUrl只管写入数据库的图片地址，而创建的新目录baseDir为另外一个。。。。这样不管你的网站通过怎样的方式访问都是OK的，这个问题郁闷了很久才解决
asp的config.asp修改如下：
Dim baseUrl, baseDir, userDir
baseUrl = "../ckfinder/userfiles/"
userDir="..\..\..\userfiles"
baseDir = server.MapPath(userDir) & "\"
至于 Unable to find an image manipulation component错误，原因很可能是生成缩略图的代码在.net framework4.0 版本上有点问题，除了要对ckfinder/userfiles文件夹赋予everyone完全控制权限，并根据千一网络的解决办法
我自己修改的时候是所设置的路径值必须一样，如CKFinderTempPath =":\外师外语系\web\ckfinder\userfiles”，web.config的value也是一样，但我自己的电脑的这个问题能很好解决，而另一台服务器还依然有问题，郁闷之后由于赶时间还是乖乖的换成了fckeditor2.6.5，这回又涉及到了路径问题，因为默认的设置是基于网站根目录，根本不能适应随地使用的需要，花了好多功夫最后找到了一个解决办法，：
' 存放图片路径依然是基于站点，
Dim ConfigUserFilesPathConfigUserFilesPath = "/web/web1/userfiles/"
但我们可以改变写进数据库的图片地址，可以用replace将‘/web/web1'替换成‘..'，这样即使移动网站也不用修改数据库的图片路径了
上一篇：下一篇：
最 近 更 新
热 点 排 行1、/ckeditor/config.js， 配置文件，如果不想写太多，可以直接写好默认配置（语言，菜单栏，宽度），有需要可以百度config配置& & config.language = 'en'；config.skin = 'v2'；config.uiColor = '#AADC6E'；config.toolbar = 'Basic'；…。& & 2、官方的demo大多都喜欢用js配置editor区域，习惯写php的我就嫌麻烦，只好看内置的php类。& & require_once ROOTPATH 。 "ckeditor/ckeditor.php"；$CKEditor = new CKEditor（）；$CKEditor-》returnOutput = true； //设置输出可用变量的情况$CKEditor-》basePath = '/ckeditor/'；//设置路径$contentarea = $CKEditor-》editor（"content"， $rs［'contents'］）； //生成一个以name为content的textarea& & echo $contentarea；& & 3、需要上传了 ，只好加入ckfinder.把ckfinder和ckeditor放在同级目录下。& & 打开/ckfinder/config.php， 首先设置第一个函数CheckAuthentication（），这个函数需要按照自己的规则写，只要return true的情况才能允许上传文件到服务器的，当然不建议直接写return true，这将导致安全问题。可以采用session来处理比较方便。& & session_start（）；function CheckAuthentication（）{ if（isset（$_SESSION［'UseEidtor'］））& & return true；else return false；}& & 4、上传文件位置：也在/ckfinder/config.php， 找到$baseUrl，之前一直想自己写一个方法用来定位路径，实在不好办，后来只好用sesssion，如果一个网站中，有需要上传到不同的位置，正好可以利用session定位。& & 复制代码代码如下:& & if （isset（$_SESSION［'UseEidtor'］）） {& & switch （$_SESSION［'UseEidtor'］） { case 'Addr1'：$baseUrl = '/addr1/uploadfile/'；case 'Addr2'：$baseUrl = '/addr2/upfiles/'；}& & } else {& & $baseUrl = '/upfiles/'；}& & 5、对于上传文件名，ckfinder会按照原有的名字命名，中文的情况下可能会乱码，所以建议使用日期重命名。打开/ckfinder/core/connector/php/php5/CommandHandler/FileUpload.php 找到《 /p》& & & & $sUnsafeFileName =CKFinder_Connector_Utils_FileSystem：：convertToFilesystemEncoding（CKFinder_Connector_Utils_Misc：：mbBasename（$uploadedFile［'name'］））；后面加上& & $sExtension = CKFinder_Connector_Utils_FileSystem：：getExtension（$sUnsafeFileName）；$sUnsafeFileName=date（'YmdHis'）。'。'.$sExtension；6、 最后就是使用ckfinder& & require_once ROOTPATH 。 "ckeditor/ckeditor.php"；require_once ROOTPATH 。 'ckfinder/ckfinder.php' ；& & $CKEditor = new CKEditor（）；$CKEditor-》returnOutput = true；$CKEditor-》basePath = '/ckeditor/'；& & CKFinder：：SetupCKEditor（$CKEditor， '/ckfinder/'） ；//注意这里是相对路径，相对于根目录，不能用绝对路径& & $contentarea = $CKEditor-》editor（"content"， $rs［'contents'］）；两者配合用起来还是挺不错的，更重要的原因是安全性高了很多。& & 您可能感兴趣的文章:含有CKEditor的表单如何提交限制ckeditor上传图片文件大小的方法php ckeditor上传图片文件名乱码解决方法ASP.NET笔记之CKEditor的使用方法asp中的ckEditor的详细配置小结SyntaxHighlighter配合CKEditor插件轻松打造代码语法着色为ckeditor编辑器加上传图片的功能ckeditor的使用和配置方法分享CI框架中集成CKEditor编辑器的教程& & QQ空间
百度搜藏更多& & Tags：CKEditor CKFinder& & 复制链接收藏本文打印本文关闭本文返回首页& & 上一篇：Fckeditor编辑器内容长度限制统计实现方法& & 下一篇：fckeditor编辑器下的自定义分页符实现方法& & 相关文章当使用ckeditor控件时，需要校验输入内容是否为空的一种解决办法FCKEidtor 自动统计输入字符个数(IE)UEditor 编辑器跨域上传解决方法PHP网页 Ewebeditor 编辑器嵌入方法一款支持插入表情的编辑器实现代码(简单思路挺重要)FCKEditor v2.6 编辑器配置图解教程FCKeditor 新闻组件的一些程序漏洞fckeditor 防止上传非法文件 增加登录判断xhEditor 免费的国产HTML在线编辑器DISCUZ论坛的UBB编辑器（增加灵活调用，支持ASP UBB解析)打包下载& & 文章评论& & 最 近 更 新& & FCKeidtor 清除编辑器内容的代码FCKeditor 图片上传进度条不动的解决方法FCKEDITOR 相关函数介绍百度编辑器从Json对象中取值，完成初次渲fckediter javascript事件函数代码FCKeditor ASP.NET 上传附件研究ckeditor的使用和配置方法分享一款支持插入表情的编辑器实现代码(简单思ASX文件 终极教程javascript. 网页编辑框及拖拽图片的问题& & 热 点 排 行& & eWebEditor 辑器按钮失效 IE8下eCKEditor/FCKEditor 使用 CKeditasp.net+FCKeditor上传图片显示叉修改fckeditor的文件上传功能步骤彻底解决ewebeditor网站后台不能asp.net CKEditor和CKFinder的应ASP FCKeditor在线编辑器使用方法DISCUZ论坛的UBB编辑器（增加灵活FckEditor 配置手册中文教程详细在asp.net中KindEditor编辑器的使
说明：该文章系网友上传分享，若未进行原创声明，则表明该文章系转载自互联网；若该文章内容涉嫌侵权，请及时向
上一篇：下一篇：
相关经验教程
的原创经验被浏览，获得 ￥0.001 收益
的原创经验被浏览，获得 ￥0.005 收益
的原创经验被浏览，获得 ￥0.005 收益
的原创经验被浏览，获得 ￥0.005 收益
的原创经验被浏览，获得 ￥0.001 收益
的原创经验被浏览，获得 ￥0.005 收益
的原创经验被浏览，获得 ￥0.005 收益
的原创经验被浏览，获得 ￥0.005 收益
的原创经验被浏览，获得 ￥0.005 收益
的原创经验被浏览，获得 ￥0.005 收益
的原创经验被浏览，获得 ￥0.005 收益
的原创经验被浏览，获得 ￥0.001 收益
的原创经验被浏览，获得 ￥0.001 收益
的原创经验被浏览，获得 ￥0.001 收益
的原创经验被浏览，获得 ￥0.005 收益
的原创经验被浏览，获得 ￥0.005 收益
的原创经验被浏览，获得 ￥0.001 收益
的原创经验被浏览，获得 ￥0.005 收益
的原创经验被浏览，获得 ￥0.005 收益
的原创经验被浏览，获得 ￥0.005 收益
的原创经验被浏览，获得 ￥0.001 收益
的原创经验被浏览，获得 ￥0.001 收益
的原创经验被浏览，获得 ￥0.005 收益
的原创经验被浏览，获得 ￥0.001 收益来源：网络
作者：酷维网
CKEditor和CKFinder的最新版可以到官方网站（）上下载得到。
把以上两个资源放到网站的根目次： /CKEditor 和 /CKFinder (不区分巨细写)
在页面行使 CKEditor：
&&&&&&& &textarea cols=&80& id=&prcontent& name=&content& rows=&50&&hello world!&/textarea&
&&&&&&& &script type=&text/javascript&&
&&&&&&&&&&& CKEDITOR.replace('content', { height: 200, width: 520 });
&&&&&&& &/script&
CKEditor 自己不自带上传成果，以是必要共同CKFinder才可以实现上传
第一步：网站必要引用CKFinder的dll（目次：/CKFinder/bin/Release/CKFinder.dll）
第二步：设置CKEditor的config.js (目次：/CKEditor/config.js ) 在CKEDITOR.editorConfig函数里加上，不必要的成果可以去掉
&&& config.filebrowserBrowseUrl= '/ckfinder/ckfinder.html'; //上传文件时赏识处事文件夹
&&& config.filebrowserImageBrowseUrl= '/ckfinder/ckfinder.html?Type=Images'; //上传图片时赏识处事文件夹
&&& config.filebrowserFlashBrowseUrl= '/ckfinder/ckfinder.html?Type=Flash';& //上传Flash时赏识处事文件夹
&&& config.filebrowserUploadUrl = '/ckfinder/core/connector/aspx/connector.aspx?command=QuickUpload&type=Files'; //上传文件按钮(标签)
&&& config.filebrowserImageUploadUrl= '/ckfinder/core/connector/aspx/connector.aspx?command=QuickUpload&type=Images'; //上传图片按钮(标签)
&&& config.filebrowserFlashUploadUrl= '/ckfinder/core/connector/aspx/connector.aspx?command=QuickUpload&type=Flash'; //上传Flash按钮(标签)
设置完成后CKEditor 就带有上传成果了，但若是上传图片时，图片的文件是用原本图片的名字，想改为随机文件名呢，怎么办？接着看第三步。
第三步：修改CKFinder的源码。CKFinder自带有源码，目次：/CKFinde/_source
在VS里新建一个 此刻的项目 指向CKFinde/_source/CKFinder.Net.sln
1) 打开/Settings/ConfigFile.cs文件
定位27行，添加一个属性：public bool RandomReN //随机重定名
定位67行，给适才的属性赋值：RandomReName = //默认值为true
生涯封锁文件
2) 打开/Connector/Config.cs文件
定位62行，添加一个属性：
&&&&&&& public bool RandomReName
&&&&&&&&&&& get { return Settings.ConfigFile.Current.RandomReN }
生涯封锁文件
3) 打开/Connector/CommandHandlers/FileUploadCommandHandler.cs文件
定位64行，添加一句判定代码：
&&&&&&&&&&&&&&&&&&&&&&& if ( Config.Current.RandomReName)& //行使随机名
&&&&&&&&&&&&&&&&&&&&&&&&&&& sFileName = DateTime.Now.ToString(&yyyyMMddHHmmssfff&) + &.& + sE
生涯封锁文件
4) 从头天生项目，把/ckfinder/_source/bin/Debug/CKFinder.dll包围/ckfinder/bin/Release/CKFinder.dll可能网站项目去掉之前插手的引用再从头从CKFinder.Net项目里的Dll
最后一步：打开/ckfinder/config.ascx
定位42行，添加一属性：（其拭魅这个加不加都可以的，由于之前有配置默认值，但行使原名时必然要配置为false）
&&&&&&& //上传完毕后行使随机文件名
&&&&&&& RandomReName =
请在这里输入您要发表的评论信息!
理智评论,文明上网,共建和谐网络.
严禁广告、谩骂等不良信息.
新手上路栏目
<img src="/uploads/allimg/--L.jpg" width="130" height="90" alt="仿拉勾网HTML模版（DIV+CSS）" title="仿拉勾网HTML模版（DIV+CSS）">
仿拉勾网HTML模版（DIV+CSS）页面导航：
→ 正文内容 在kindEditor中获取当前光标的位置索引
在kindEditor中获取当前光标的位置索引的实现代码
一直在用KindEditor,今天要用到光标的位置,然后就gg一下办法,后来发现这东西的编辑区域居然是iframe里面的一个body,不是textarea/input,后来就翻开了他的代码看,发现有个insertHtml
呵呵,有这个说明他自己有获取光标位置的办法,然后顺藤摸瓜找到了,拿出来分享一下. 下面editor.cmd.range.startOffset部分就是了.
代码如下: KindEditor.ready(function () { editor = KindEditor.create("#txt_content"); alert(editor.cmd.range.startOffset);} );
另: 还发现有个editor.cmd.range.endOffset,不知道是干嘛的,哪位兄弟知道的指点一下.多谢. 答：startOffset是开始位置，那么endOffset应当是结束位置，这样我们可以应该可以获取到选中的文字。
您可能感兴趣的文章:
上一篇：下一篇：
最 近 更 新
热 点 排 行扫扫二维码，随身浏览文档
手机或平板扫扫即可继续访问
CKEditor+CKFinder 解决上传图片路径问题
举报该文档为侵权文档。
举报该文档含有违规或不良信息。
反馈该文档无法正常浏览。
举报该文档为重复文档。
推荐理由：
将文档分享至：
分享完整地址
文档地址：
粘贴到BBS或博客
flash地址：
支持嵌入FLASH地址的网站使用
html代码：
&embed src='/DocinViewer-.swf' width='100%' height='600' type=application/x-shockwave-flash ALLOWFULLSCREEN='true' ALLOWSCRIPTACCESS='always'&&/embed&
450px*300px480px*400px650px*490px
支持嵌入HTML代码的网站使用
您的内容已经提交成功
您所提交的内容需要审核后才能发布，请您等待！
3秒自动关闭窗口}