J2EE学习笔记——JSP使用Fckeditor 上传图片

首先需要下载     FCKidetor  所用的文件  和相关 jar 包     并导入,    在这里下载             点击下载FCK文件和jar包 


项目截图:


一、FCK配置

1、解压FCKidetor  所用的jar 包  (上面下载的)后,将jar包导入至工程的lib中;

2、FCKeditor.zip解压后,将fckeditor文件夹整个拷贝至WebRoot下。

3、新建fckditor.propertise(---文件放到src目录下)   

      fckditor.propertise  的内容为:connector.userActionImpl=net.fckeditor.requestcycle.impl.UserActionImpl


4、在web.xml中加入下面一段代码:

<servlet>
      <servlet-name>Connector</servlet-name>
        <servlet-class>
          net.fckeditor.connector.ConnectorServlet
      </servlet-class>
      <load-on-startup>1</load-on-startup>
    </servlet>
	
 <servlet-mapping>
      <servlet-name>Connector</servlet-name>
      <url-pattern>
        /fckeditor/editor/filemanager/connectors/*
      </url-pattern>
    </servlet-mapping>

=========================================================================================

index.jsp代码:

 
<%@ page language="java" import="java.util.*" pageEncoding="gb2312"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>My JSP 'index.jsp' starting page</title>
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	
	
	<script language="javascript" type="text/javascript" src="DatePicker/WdatePicker.js" ></script>
 <script type="text/javascript" src="fckeditor/fckeditor.js"></script>
 
	<script type="text/javascript">

window.onload = function()
{
	
    var sBasePath="<%=request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+request.getContextPath()+"/fckeditor/" %>"
	var oFCKeditor = new FCKeditor( 'pfckeditor' ) ;
	oFCKeditor.BasePath	= sBasePath ;
	oFCKeditor.ReplaceTextarea() ;
}

	</script>
  </head>
  
  <body>
   <form action ="SaveTheFCK" method="post">
 

    <textarea rows="90" cols="120" name="pfckeditor">
    </textarea>
    <br>
    点击显示日期: <input type="text" name="time" onClick="WdatePicker()">
    <br>
    <input type="submit" value="提交">
    </form>
  </body>
</html>




==========================================================================================

程序源代码:点击下载 源代码

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
彻底解决fckeditor(jsp版)上中文图片乱码问题,我这里用的编码是utf-8的,这里用的fckeditor 是2.6的,fckeditor.java包是2.3的,经过我修改ConnectorServlet.java和SimpleUploaderServlet.java两个文件,重新生成fckeditor-java-2.3.jar包, 要解决所有的乱码问题,有3部要修改, 1.修改Web容器的字符编码,如果Web容器用的是Tomcat,则修改conf/server.xml文件,在两个Connector中添加“URIEncoding="utf-8"”,我这里用的是utf-8编码,所以修改成utf-8,若项目是gb2312编码,则设置为“URIEncoding="gb2312"”。 2.在“浏览服务器”页面中上文件时,打开项目WebRoot中的文件/editor/filemanager/browser/default/frmupload.html,在head中加一个meta: <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />,看看该文件是不是utf-8格式的,若不是,则转换成utf-8,若你用的不是utf-8则转成你用的那种编码,上面charset也设置成你用的编码 3.修改ConnectorServlet.java和SimpleUploaderServlet.java两个文件,我在这两个文件中都是加了一个静态变量encoding,private static String encoding;保存项目中的编码, 若在web.xml文件中没有给这个变量值的话,默认是gb2312,如下代码if(encoding.isEmpty()){encoding="gb2312";},在ConnectorServlet.java的doGet与doPost的开头部分加入request.setCharacterEncoding(encoding);将请求的字符集编码设置成项目中的编码,在ConnectorServlet.java和SimpleUploaderServlet.java两个文件中的DiskFileUpload upload = new DiskFileUpload();后面加入upload.setHeaderEncoding(encoding);告诉FileUpload组件处理时的编码为项目编码,在FileItem中,用getString(encoding),这项设置可以解决获取的表单字段为乱码的问题,所以在每个FileItem实例后面都执行一次getString(encoding),就告诉FileItem在取值时用的编码是encoding所设置的编码。如在ConnectorServlet.java和SimpleUploaderServlet.java两个文件中的 FileItem item后面加上一句item.getString(encoding);在FileItem uplFile后面加上一句uplFile.getString(encoding); 接下来就是设置web.xml了,在web.xml中给上面讲到的encoding值,如下 <init-param> <param-name>encoding</param-name> <param-value>utf-8</param-value> </init-param> 一切都OK了,真正的解决了上中文名图片乱码问题。 在上面的第3步中,要用到Ant产生jar,这时要注意, 把Tomcat安装目录下/server/lib里的catalina-ant.jar复制到项目的/WEB-INF/lib下。打开build.xml,修改property name="catalina.home"成Tomcat的安装目录。修改taskdef name="deploy"、taskdef name="list"、taskdef name="reload"、taskdef name="undeploy"如下: <taskdef name="deploy" classname="org.apache.catalina.ant.DeployTask"> <classpath refid="compile.classpath"></classpath> </taskdef> <taskdef name="list" classname="org.apache.catalina.ant.ListTask"> <classpath refid="compile.classpath"></classpath> </taskdef> <taskdef name="reload" classname="org.apache.catalina.ant.ReloadTask"> <classpath refid="compile.classpath"></classpath> </taskdef> <taskdef name="undeploy" classname="org.apache.catalina.ant.UndeployTask"> <classpath refid="compile.classpath"></classpath> </taskdef> 然后在Eclipse的Outline窗口中运行Ant的dist,就会生成的新的FCKeditor-2.3.jar。 绝对是真实的,共享出来与大家分享,少一个上其它文件的,如RAR的,有添加过这个功能的朋友也拿出来共享下吧
最近做了一个文章管理的系统,用到在线编辑器,修改了一下现在能实现音频,视频,图片,附件,Flash等文件的上。费了好大的功夫。。 FCKeditor应用在ASP.NET上,需要两组文件,一组是FCKeditor本身,另一个是用于ASP.NET的FCKeditor控件(分为1.1和2.0两个版本,这里使用2.0版本)。 1. 将FCKeditor加入到项目中 解压FCKeditor编辑器,得到文件夹fckeditor,复制此文件夹到Web应用的项目下(也可以是子孙目录下)。 解压FCKeditor控件,在其子目录bin/Release/2.0下有一个程序集。在Web应用的项目中引用该程序集。 2. 在页面中使用FCKeditor 有两种方式。 (1)手工编码 在页面中加入ASP.NET指令: 然后在需要的地方加入FCKeditor控件: (2)集成到Visual Studio工具箱 打开一ASP.NET页面,展开Toolbox,打开右键菜单,选择“Choose Items ...”,在出现的“Choose Toolbox Items”会话框的“.NET Framework Components”选项卡中选择“Browse”,找到并选中FCKeditor程序集,打开后回到“Choose Toolbox Items”窗口,点击“OK”,完成控件导入。 这时,在Toolbox的General分类下出现了一个名为FCKeditor的控件,可以像使用Visual Studio内置控件一样使用它。 3. 配置FCKeditor编辑器路径 在页面中,使用的是FCKeditor控件,该控件需要知道FCKeditor编辑器文件组的路径。有两种配置方法。 (1)配置web.config 在appSettings配置节中加入 使用这种配置方法后,对于项目中任何一个页面中用到的FCKeditor控件,都不用再配置其BasePath属性。 (2)直接对用到的FCKeditor控件进行配置 在页面代码中设置FCKeditor的属性BasePath为FCKeditor编辑器文件组的路径,或者在Page_Init事件处理器中设置其BasePath的值。 4. 配置FCKeditor编辑器文件上路径 在web.config的appSettings配置节中加入 或者 这样,就完成了FCKeditor向ASP.NET页面的集成工作。 二、配置FCKeditor 按照FCKeditor的默认配置,可以完成一些常用的HTML可视化编辑工作,但在实际应用中,还需要对其做进一步的配置。FCKeditor控件的可配置属性不多,且配置后只能作用于一个单一实例。实际上,需要对FCKeditor编辑器文件组中的通用配置文件/fckconfig.js和ASP.NET专用文件上管理代码文件/editor/filemanager/connectors/aspx/config.ascx进行配置。 1. 配置控件语言 FCKeditor是自动探测浏览器所使用的语言编码的,其默认语言是英文。修改配置行"FCKConfig.DefaultLanguage = 'en';"为'zh-cn',采用中文为默认语言。 2. 配置控件应用技术 FCKeditor默认是用于php技术的。修改配置行"var _FileBrowserLanguage = 'php';"和"var _

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值