使用fckeditor上传多张图片
流程:
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上传多张图片的更多相关文章
- iOS -- 上传多张图片 后台(PHP)代码和上传一张的一样
// 上传多张图片 - (void)send { // 设置初始记录量为0 self.count = 0; self.upcount = 0; // 设置初始值为NO self.isUploadPic ...
- php用jquery-ajax上传多张图片限制图片大小
php用jquery-ajax上传多张图片限制图片大小 /** * 上传图片,默认大小限制为3M * @param String $fileInputName * @param number $siz ...
- 微信JSSDK上传多张图片
之前是使用for循环实现的,但是安卓手机没有问题,苹果手机只能上传最后一张图片. 好在有高手在前面趟路,实用的循环调用.苹果是没有,安卓不清楚.以下内容转自:http://leo108.com/pid ...
- 整理几个js上传多张图片的效果
一.普通的上传图片,张数不限制 <!DOCTYPE HTML> <html> <head> <meta charset="UTF-8"&g ...
- 如何在IPFS里面上传一张图片
之前有好几人问过小编,想在IPFS里面上传一张图片.如何做? 今天小编就讲一下如何在IPFS里面上传.下载文件? 1 下载IPFS软件 下载地址:https://dist.ipfs.io/#go-ip ...
- Ajax+PHP实现异步上传多张图片
Ajax+PHP实现异步上传多张图片 HTML代码 <!-- date: 2018-04-27 13:46:55 author: 王召波 descride: 多张图片上传 --> < ...
- 1) 上传多张图片时 ,对 $_FILES 的处理. upload ; 2)fileinput 上传多张图片. 3) 修改,删除的时候删除原来的资源,图片 update, delete , 删除 4)生成器中两个字段上传图片的时候,要修改生成器生成的代码
1上传多张图片, 要对 $_FILES进行 重新处理. //添加 public function addCourseAlbumAction() { $CourseAlbumModel = new Co ...
- Okhttp3上传多张图片同时传递参数
之前上传图片都是直接将图片转化为io流传给服务器,没有用框架传图片. 最近做项目,打算换个方法上传图片. Android发展到现在,Okhttp显得越来越重要,所以,这次我选择用Okhttp上传图片. ...
- POST请求上传多张图片并携带参数
POST请求上传多张图片并携带参数 在iOS中,用POST请求携带参数上传图片是非常恶心的事情,HTTPBody部分完全需要我们自己来配置,这个HTTPBody分为3个部分,头部分可以携带参数,中间部 ...
随机推荐
- [多线程]多线程(Thread、Runnable、Callable)
1.继承Thread类,重写run方法 线程 是程序中的执行线程.Java 虚拟机允许应用程序并发地运行多个执行线程. 每个线程都有一个优先级,高优先级线程的执行优先于低优先级线程.每个线程都可以或不 ...
- 查看mysql 表大小
select round(sum(DATA_LENGTH / 1024 / 1024 ), 2) from `information_schema`.`tables` where table_sche ...
- linux path 与 classpath 区别
一.OS依据path中的路径信息来寻找可执行指令: 例如: cat /etc/profile 我们就可以在任意目录执行hadoop / hdfs / yarn / java 等相关命令了 export ...
- 白鹭引擎 - 绘制圆形的进度条 ( graphics )
class Main extends egret.DisplayObjectContainer { /** * Main 类构造器, 初始化的时候自动执行, ( 子类的构造函数必须调用父类的构造函数 ...
- Redis 五大数据类型及常用操作
# 更详细的操作命令请查看 => http://redisdoc.com/ 1: KEY ( 键值 ) => 常见操作 2: String ( 字符串 ), 最大支持 512M 2.1: ...
- java对象比较==和equals的区别
转载:http://blog.csdn.net/bluesky_usc/article/details/51849125 1值比较 即内容相同,我们就认为是相等的.比如:int i=5:int j = ...
- delphi 第三方组件 log4cpp.dll
log4cpp.dll LogHelper.dll TcxGridSite TcxSpreadSheetBook TcxSpreadSheetBook TcxTreeList TcxButtonEdi ...
- 机器学习进阶-案例实战-停车场车位识别-keras预测是否停车站有车
import numpy import os from keras import applications from keras.preprocessing.image import ImageDat ...
- 爬虫--requests模块学习
requests模块 - 基于如下5点展开requests模块的学习 什么是requests模块 requests模块是python中原生的基于网络请求的模块,其主要作用是用来模拟浏览器发起请求.功能 ...
- C# 中奇妙的函数–String Split 和 Join
很多时候处理字符串数据,比如从文件中读取或者存入 - 我们可能需要加入分隔符(如CSV文件中的逗号),或使用一个分隔符来合并字符串序列. 很多人都知道使用split()的方法,但使用与其对应的Join ...