【广告项目】ftp+uploadify实现图片多图片上传预览

$(function(){
$('#appendFile1').delegate('.mailListDel1', 'click' ,function(){
var _this = $(this);
var el = _this.parent().remove();
})
var definedData = [];
definedData.fileTypeExts = "*.png;*.jpeg;*.gif;*.jpg";
$("#uploadAttach1").uploadify({
'height'        : 20,//	设置浏览按钮的高度
'width'         : 80,
'buttonText'    : '添加图片',
'swf'           : '${pageContext.request.contextPath}/plugin/uploadify.swf',
'uploader'      : '${pageContext.request.contextPath}/daily/uploadAttach',
'auto'          : true,
'multi'         : true,//设置为true时可以上传多个文件。
'removeCompleted': true,
'cancelImg'     : '${pageContext.request.contextPath}/plugin/cancel.png',
'fileTypeExts'  : definedData.fileTypeExts,
'fileSizeLimit' : '100MB',
'fileObjName'   : 'file1',
'sizeLimit': '99999999999',
'onUploadSuccess':function(file,data,response){
var jsonData = JSON.parse(data);
$.each(jsonData,function(i,v){
$("#uploadAttach-queue1").append(
"<div style='float:left;text-align:center; padding: 0 5px;'>"+"<img src='"+v.attachPath+"' alt='' style='width: 130px;height:100px'/><a href='#' class='mailListDel1 ' style='color:#929292;display:block;'> 删除 </a><input type='hidden' name='path1' value=" + v.attachPath + "><input type='hidden' name='attachNmaeArr1' value=" + v.attachName + "></div>"
)
})
},
//加上此句会重写onSelectError方法【需要重写的事件】
'overrideEvents': ['onSelectError', 'onDialogClose'],
//返回一个错误，选择文件的时候触发
'onSelectError':function(file, errorCode, errorMsg){
switch(errorCode) {
case -110:
alert("文件 ["+file.name+"] 大小超出系统限制的" + jQuery('#uploadAttach1').uploadify('settings', 'fileSizeLimit') + "大小！");
break;
case -120:
alert("文件 ["+file.name+"] 大小异常！");
break;
case -130:
alert("文件 ["+file.name+"] 类型不正确！");
break;
}
},

});
$(".cancle").hide();
})

<div class="full">
<span class="formContentName lf">刊物信息：</span>
<div  id="appendFile1" style=" box-sizing: border-box;padding-left:135px">
<div>
<input  type="file"  id="uploadAttach1" name="files1" />
<div id="uploadAttach-queue1" class="uploadify-queue1"></div>
</div>
</div>
</div>

@RequestMapping("uploadAttach")
public void  uploadAttach(final HttpSession session,HttpServletRequest request, HttpServletResponse response) throws IOException{
List<TaMail> list = new ArrayList<TaMail>();
MultipartHttpServletRequest multipartRequest =  (MultipartHttpServletRequest) request;
Map<String, MultipartFile> fileMap = multipartRequest.getFileMap();
String fileName = null;
for (Map.Entry<String, MultipartFile> entity : fileMap.entrySet()) {
//获得源文件,上传到服务器,返回文件名称和路径;
MultipartFile mf = entity.getValue();
fileName = mf.getOriginalFilename();//获取原文件名
if(fileName.length() > 0){
TaMail mail = new TaMail();
Date now = new Date();
SimpleDateFormat dateFormat = new SimpleDateFormat("yyyy/MM/dd");
String filePath = dateFormat.format(now);
String newName = UUID.randomUUID().toString();
String subfix = fileName.substring(fileName.lastIndexOf("."));
Boolean flag = FtpUtil.uploadFile(ftpIp, ftpPort, ftpUserName, ftpPassword, ftpRemotePath,
filePath, newName+subfix, mf.getInputStream());
final String attachPath= new String(httpUrl+filePath+"/"+newName+subfix);
mail.setAttachName(fileName);
mail.setAttachPath(attachPath);
list.add(mail);
}
}
response.setCharacterEncoding("UTF-8");
response.setContentType("application/json; charset=utf-8");
response.getWriter().write(JsonUtils.objectToJson(list));
}