流程:

1.使用fck上传图片到后台

2.后台上传图片到服务器端

3.服务器端返回上传信息

1.jsp页面

<script type="text/javascript">
$(function(){
var tObj;
$("#tabs a").each(function(){
if($(this).attr("class").indexOf("here") == 0){tObj = $(this)}
$(this).click(function(){
var c = $(this).attr("class");
if(c.indexOf("here") == 0){return;}
var ref = $(this).attr("ref");
var ref_t = tObj.attr("ref");
tObj.attr("class","nor");
$(this).attr("class","here");
$(ref_t).hide();
$(ref).show();
tObj = $(this);
if(ref == '#tab_2'){
var fck = new FCKeditor("productdesc");
fck.BasePath = "/res/fckeditor/";
fck.Config["ImageUploadURL"] = "/upload/uploadFck.do";
fck.Height = 400 ;
fck.ReplaceTextarea();
}
});
});
});
function uploadPic(){
var options={
url:"/upload/uploadPic.do",
dataType:"json",
type:"post",
success:function(data){
$("#product_url").attr("src",data.url);
$("#imgUrl").val(data.path);
}
};
$("#jvForm").ajaxSubmit(options);
}
</script>
<tbody id="tab_2" style="display: none">
<tr>
<td >
<textarea rows="10" cols="10" id="productdesc" name="description"></textarea>
</td>
</tr>
</tbody>

2.controller层

 //异步上传没有返回值
@RequestMapping(value="/upload/uploadFck.do")
public void uploadFck(HttpServletRequest request, HttpServletResponse response){
MultipartHttpServletRequest ms = (MultipartHttpServletRequest) request;
Map<String, MultipartFile> filemap = ms.getFileMap();
Set<Entry<String,MultipartFile>> entrySet = filemap.entrySet();
for (Entry<String, MultipartFile> entry : entrySet) {
MultipartFile pic = entry.getValue();
Client client = new Client();
///图片生成策略
DateFormat df = new SimpleDateFormat("yyyyMMddHHmmssSSS");
String format = df.format(new Date());
Random r = new Random();
for(int i = 0;i<3; i++){
format += r.nextInt(10);
}
//得到文件扩张名
String ext = FilenameUtils.getExtension(pic.getOriginalFilename());
String path = "upload/"+format+"."+ext;
String url = "http://localhost:8088/image-web/"+path; //服务器路径
WebResource resource = client.resource(url);
try {
resource.put(String.class,pic.getBytes());
} catch (Exception e) {
e.printStackTrace();
}
UploadResponse ok = UploadResponse.getOK(url);//ok是个对象
try {
response.getWriter().print(ok); //使用print可以返回对象
//write 字符流
//print 字节流
} catch (IOException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
} }

使用fckeditor上传多张图片的更多相关文章

  1. iOS -- 上传多张图片 后台(PHP)代码和上传一张的一样

    // 上传多张图片 - (void)send { // 设置初始记录量为0 self.count = 0; self.upcount = 0; // 设置初始值为NO self.isUploadPic ...

  2. php用jquery-ajax上传多张图片限制图片大小

    php用jquery-ajax上传多张图片限制图片大小 /** * 上传图片,默认大小限制为3M * @param String $fileInputName * @param number $siz ...

  3. 微信JSSDK上传多张图片

    之前是使用for循环实现的,但是安卓手机没有问题,苹果手机只能上传最后一张图片. 好在有高手在前面趟路,实用的循环调用.苹果是没有,安卓不清楚.以下内容转自:http://leo108.com/pid ...

  4. 整理几个js上传多张图片的效果

    一.普通的上传图片,张数不限制 <!DOCTYPE HTML> <html> <head> <meta charset="UTF-8"&g ...

  5. 如何在IPFS里面上传一张图片

    之前有好几人问过小编,想在IPFS里面上传一张图片.如何做? 今天小编就讲一下如何在IPFS里面上传.下载文件? 1 下载IPFS软件 下载地址:https://dist.ipfs.io/#go-ip ...

  6. Ajax+PHP实现异步上传多张图片

    Ajax+PHP实现异步上传多张图片 HTML代码 <!-- date: 2018-04-27 13:46:55 author: 王召波 descride: 多张图片上传 --> < ...

  7. 1) 上传多张图片时 ,对 $_FILES 的处理. upload ; 2)fileinput 上传多张图片. 3) 修改,删除的时候删除原来的资源,图片 update, delete , 删除 4)生成器中两个字段上传图片的时候,要修改生成器生成的代码

    1上传多张图片, 要对 $_FILES进行 重新处理. //添加 public function addCourseAlbumAction() { $CourseAlbumModel = new Co ...

  8. Okhttp3上传多张图片同时传递参数

    之前上传图片都是直接将图片转化为io流传给服务器,没有用框架传图片. 最近做项目,打算换个方法上传图片. Android发展到现在,Okhttp显得越来越重要,所以,这次我选择用Okhttp上传图片. ...

  9. POST请求上传多张图片并携带参数

    POST请求上传多张图片并携带参数 在iOS中,用POST请求携带参数上传图片是非常恶心的事情,HTTPBody部分完全需要我们自己来配置,这个HTTPBody分为3个部分,头部分可以携带参数,中间部 ...

随机推荐

  1. web前端基本开发手册

    --------------------------------- 一.概况 1.1  WEB 标准 二.实现WEB标准 2.1  XHTML.CSS介绍 2.2  XHTML书写规范 2.2.1 X ...

  2. scala变量类型和性质

    最高的父类型为Any,最低类型为Nothing Any is the supertype of all types, also called the top type. It defines cert ...

  3. 中国大学mooc直播回放看这里哦http://www.icourse163.org/forum/1001974001/topic-1003372881.htm?sortType=1&pageIndex=1

    中国大学mooc直播回放看这里哦http://www.icourse163.org/forum/1001974001/topic-1003372881.htm?sortType=1&pageI ...

  4. new date() 计算本周周一日期

    new date() 计算本周周一日期 需求:计算某天的那一周周一的日期 1.new Date() date.getDay(); //获取周几 0-6 date.getTime();//获取时间戳 1 ...

  5. [bcc32 Error] ws2def.h(231): E2238 Multiple declaration for 'sockaddr'

    [bcc32 Error] ws2def.h(231): E2238 Multiple declaration for 'sockaddr'  Full parser context    ksrGe ...

  6. 5分钟快速打造WebRTC视频聊天<转>

    原文地址: 5分钟快速打造WebRTC视频聊天 百度一下WebRTC,我想也是一堆.本以为用这位朋友( 搭建WebRtc环境 )的SkyRTC-demo 就可以一马平川的实现聊天,结果折腾了半天,文本 ...

  7. 函数参数,const 引用 和 非 const引用是不同的函数。

    举个例子, void f(const int &x) 和 void f(int &x) 是不同的函数. 函数的返回值不能作为区分

  8. jquery_ajax 地址三级联动

    jquery 的三级地址联动,原理与javascript类似,只是在触发请求的时候,使用封装好的 $.get ,$post,$.ajax 方法去执行,其余的都是一样的,后台服务器请求文件是一样的,前台 ...

  9. AWK 知识库

    awk 极客课程 <AWK 编程语言>1 <AWK 编程语言>2 <AWK程序设计语言>https://github.com/wuzhouhui/awk http: ...

  10. Linux后门入侵检测工具

    一.rootkit简介 rootkit是Linux平台下最常见的一种木马后门工具,它主要通过替换系统文件来达到入侵和和隐蔽的目的,这种木马比普通木马后门更加危险和隐蔽,普通的检测工具和检查手段很难发现 ...