单独使用fckeditor的文件上传功能

本文介绍如何将FCKeditor的文件上传功能独立出来使用,包括配置web.xml、修改frmresourceslist.html文件及调用方法。

fckeditor的文件上传功能做的确实不错,但只能在编辑器中使用,有点不爽,今天做了一些修改,完成了对它的单独使用。

我用的是fckeditor2.6.4版本

1.在web.xml中增加如下内容
<servlet>
<servlet-name>FckConnector</servlet-name>
<servlet-class>
net.fckeditor.connector.ConnectorServlet
</servlet-class>
<load-on-startup>1</load-on-startup>
</servlet>
<servlet-mapping>
<servlet-name>FckConnector</servlet-name>
<url-pattern>
/fckeditor/editor/filemanager/browser/default/connectors/jsp/connector
</url-pattern>
</servlet-mapping>

注意:不要把原来的去掉,如去掉编辑器中的文件上传将不能使用

2.修改fckeditor/editor/filemanager/broswer/default/frmresourceslist.html文件

添加一个函数用于获取参数

function GetUrlParam( paramName )
{
var oRegex = new RegExp( '[/?&]' + paramName + '=([^&]+)', 'i' ) ;
var oMatch = oRegex.exec( window.top.location.search ) ;

if ( oMatch && oMatch.length > 1 )
return decodeURIComponent( oMatch[1] ) ;
else
return '' ;
}

修改一个函数

function OpenFile( fileUrl )
{
/*

//注释掉的是原来的

window.top.opener.SetUrl( encodeURI( fileUrl ).replace( '#', '%23' ) ) ;
window.top.close() ;
window.top.opener.focus() ;*/

var parent = window.top.opener;

if(parent!=null){
parentDocument = parent.document;
try{
//获取id,用于决定把值放在那个文本框中
if(parentDocument.getElementById(GetUrlParam("id"))!=null){
parentDocument.getElementById(GetUrlParam("id")).value=fileUrl;
}

var basePath=parentDocument.getElementById("basePath");
var img=parentDocument.getElementById("imgurl");
if(img != null && basePath !=null)
{
img.src=basePath.value+fileUrl;

}
}catch(e){
window.top.close();
}
window.top.close();
}

if(window.top.opener!=null){
window.top.opener.SetUrl( fileUrl ) ;
window.top.close() ;
window.top.opener.focus() ;
}else{
window.returnValue = fileUrl ;
window.top.close() ;
}
}

3.调用

window.open('/fckeditor/editor/filemanager/browser/default/browser.html?Type=Image&Connector=connectors/jsp/connector&id=selectLOGO','','width=600,height=400,left=200,top=200');

参数id是你想要把文件url放在那个文件框的id

有问题?直接google! <script type="text/javascript"><!-- google_ad_client = "pub-0757178726455256"; google_ad_format = "js_sdo"; google_cts_mode ="rs"; google_num_cts = "2"; google_searchbox_width = 215; google_searchbox_height = 26; google_link_target = 2; google_logo_pos = "left"; google_rs_pos = "right"; google_ad_height = 35; google_ad_width = 760; // --></script><script src="http://pagead2.googlesyndication.com/pagead/show_sdo.js" type="text/javascript"></script>

<script type="text/javascript"><!-- google_ad_client = "pub-0757178726455256"; /* 728x90, 创建于 09-6-17 */ google_ad_slot = "1633515232"; google_ad_width = 728; google_ad_height = 90; // --></script><script src="http://pagead2.googlesyndication.com/pagead/show_ads.js" type="text/javascript"></script>

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值