需要的文件 jquery.uploadify-3.1.min.js 、uploadify.css
单文件上传
1、HTML和JS部分
<input type="file" name="file_upload" id="file_upload"/>
function uploadPicT() {
$("#file_upload").uploadify({
'height' : 27, // 按钮的高度
'buttonText' : '上传图片', // 按钮的名称
'swf' : globlePath + '/includes/uploadify/uploadify.swf', // 动画的地址
'uploader' : globlePath + '/web/upTree/uploadPic.do',// 上传的地址
'auto' : true, // 是否为选中自动上传
'multi' : false,// 是否允许多文件上传
'method' : 'post',
// 'removeCompleted' : false,//是否可以取消 默认是true
'cancelImg' : globlePath + '/includes/uploadify/uploadify-cancel.png',
'fileTypeExts' : '*.jpg;*.jpge;*.gif;*.png', // 允许的格式
'fileSizeLimit' : '2MB',// 允许的大小
'fileObjName' : 'meinv',// 上传的名字
'formData' : {
'brandType' : '111',
'brandId' : '222'
},// 上传的参数
'onUploadSuccess' : function(file, data, response) {
alert("上传成功");
var obj = eval('(' + data + ')');
$('#logoPath').val(obj.realPath);
},
'onSelectError' : function(file, data, response) {
alert("上传出错");
}
/* //加上此句会重写onSelectError方法【需要重写的事件】
'overrideEvents' : [ 'onSelectError', 'onDialogClose' ],
//返回一个错误,选择文件的时候触发
'onSelectError' : function(file, errorCode, errorMsg) {
switch (errorCode) {
case -110:
alert("文件 ["
+ file.name
+ "] 大小超出系统限制的"
+ jQuery('#dialogPic').uploadify(
'settings', 'fileSizeLimit')
+ "大小!");
break;
case -120:
alert("文件 [" + file.name + "] 大小异常!");
break;
case -130:
alert("文件 [" + file.name + "] 类型不正确!");
break;
}
}*/
});
}
2、后台java部分
@RequestMapping(value = "/uploadPic", method = { RequestMethod.POST })
public void uploadPic(
@RequestParam("meinv") MultipartFile meinv,
@RequestParam(value = "brandId") String bannerid,
HttpServletRequest request, HttpServletResponse response) {
DateFormat df = new SimpleDateFormat("yyyyMMddhhmmss");
Date date = new Date();
try {
String fileName = meinv.getOriginalFilename(); // 上传的文件名称
String postfix = fileName.substring(fileName.lastIndexOf("."),
fileName.length());// 文件后缀
String sufffix = df.format(date) + postfix;// 保存的文件名称 加扩展名
String realPath = BizTypeUtils.UPLOAD_DIRECTORY + File.separator
+ String.valueOf(Calendar.getInstance().get(Calendar.YEAR));
File savefile = new File(new File(realPath), sufffix);
if (!savefile.getParentFile().exists()) {
savefile.getParentFile().mkdirs();
}
FileCopyUtils.copy(meinv.getBytes(), savefile);
WebUtil.writeToWeb(response, WebUtil.SUCCESS);
} catch (Exception e) {
WebUtil.writeToWeb(response, WebUtil.FAILURE);
}
}
2、多文件上传
1、HTML和JS部分
<div id="dialogDP" style="padding: 5px 5px; display: none;">
<div id="fileQueue"></div>
<input type="file" name="uploadify" id="uploadify"/>
<a href="javascript:void(0)"class="easyui-linkbutton" iconCls="icon-search" οnclick="$('#uploadify').uploadify('upload')">上传</a>
<a href="javascript:void(0)"class="easyui-linkbutton" iconCls="icon-search" οnclick="$('#uploadify').uploadify('cancel')">取消</a>
<a href="javascript:void(0)"class="easyui-linkbutton" iconCls="icon-search" οnclick="$('#uploadify').uploadify('upload','*')">上传所有</a>
<a href="javascript:void(0)"class="easyui-linkbutton" iconCls="icon-search" οnclick="$('#uploadify').uploadify('cancel','*')">取消所有</a>
</div>
2、java部分
@RequestMapping(value = "/uploadDouPic", method = { RequestMethod.POST })
public void uploadDouPic(@RequestParam(value = "brandId") String brandId,
HttpServletRequest request, HttpServletResponse response) {
DateFormat df = new SimpleDateFormat("yyyyMMddhhmmss");
Date date = new Date();
MultipartHttpServletRequest multipartRequest = (MultipartHttpServletRequest) request;
Map<String, MultipartFile> fileMap = multipartRequest.getFileMap();
String ctxPath = BizTypeUtils.UPLOAD_DIRECTORY + File.separator
+ String.valueOf(Calendar.getInstance().get(Calendar.YEAR));
System.out.println("ctxpath=" + ctxPath); // 创建文件夹
File file = new File(ctxPath);
if (!file.exists()) {
file.mkdirs();
}
String fileName = null;
for (Map.Entry<String, MultipartFile> entity : fileMap.entrySet()) { // 上传文件
MultipartFile mf = entity.getValue();
fileName = mf.getOriginalFilename();// 获取原文件名
// System.out.println("filename="+fileName);
String postfix = fileName.substring(fileName.lastIndexOf("."),
fileName.length());// 文件后缀
String sufffix = df.format(date) + postfix;// 保存的文件名称 加扩展名
File uploadFile = new File(ctxPath + sufffix);
try {
FileCopyUtils.copy(mf.getBytes(), uploadFile);
WebUtil.writeToWeb(response, WebUtil.SUCCESS);
} catch (IOException e) {
// responseStr = "上传失败";
e.printStackTrace();
WebUtil.writeToWeb(response, WebUtil.FAILURE);
}
}
}
在springMvc中加载上配置
<!-- 上传拦截,如最大上传值及最小上传值 -->
<bean id="multipartResolver"
class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
<!-- one of the properties available; the maximum file size in bytes -->
<property name="maxUploadSize" value="5000000000" />
<property name="maxInMemorySize" value="4096" />
</bean>