码迷,mamicode.com
首页 > Web开发 > 详细

JQuery上传插件Uploadify使用详解

时间:2015-06-13 17:12:45      阅读:210      评论:0      收藏:0      [点我收藏+]

标签:ajax   上传图片   

1:准备工作
      官方下载地址:http://www.uploadify.com/download/
      技术分享
2:引入文件
<link href="uploadify.css" rel="stylesheet">
<script src="jquery.uploadify.min.js"></script>


3:前台页面
<input type="hidden" id="filepathInput" />
<input type="file" id="btnUploadify" name="uploadify" />
<div id="show_back"></div>

 

4:初始化控件

function initUploadify() {
$("#btnUploadify").uploadify({
height: 30,
swf: "uploadify.swf",
cancelImage: "uploadify-cancel.png",
uploader: ‘common/op/uploadFileForMedia.shtml?type=video‘,
fileTypeDesc: ‘视频类型‘,
fileTypeExts: ‘*.mp4‘,
width: 100,
multi: false,
fileSizeLimit : ‘10MB‘, //设置单个文件大小限制
method: ‘post‘,
fileObjName: ‘uploadify‘,
buttonText: "选择文件",
onUploadSuccess: function (file, data, response) {
//上传成功
if (response) {
var dataJson = eval("(" + data + ")");
$("#filepathInput").val(dataJson.filePath);
var html = ‘<video controls=controls autoplay=autoplay> ‘
+‘<source src="‘+ dataJson.basepath + "\/" + dataJson.filename+‘" type="video/mp4" />‘
+‘</video>‘;
$("#show_back").html(html);
}
},
onUploadError : function(file,errorCode,errorMsg,errorString,swfuploadifyQueue) {
},
auto: true
});
}
5:后台代码
 
 
public class FileUploadAction extends BaseAction {
 
private File uploadify;
private String uploadifyFileName;
 
public String uploadFile() throws Exception {
map = new HashMap<String, Object>();
// 上传完后文件存放位置
String savePath = getRealPath() + "upload";
System.out.println(savePath);
String newsuffix = "";
String current = UUID.randomUUID().toString();
if ((uploadifyFileName != null) && (uploadifyFileName.length() > 0)) {
int dot = uploadifyFileName.lastIndexOf(".");
if ((dot > -1) && (dot < (uploadifyFileName.length() - 1))) {
newsuffix = uploadifyFileName.substring(dot + 1);
}
}
FileInputStream fis = null;
FileOutputStream fos = null;
try {
fis = new FileInputStream(uploadify);
String serPath = savePath + File.separatorChar + current + "."
+ newsuffix;
fos = new FileOutputStream(serPath);
IOUtils.copy(fis, fos);
map.put("filename", current + "." + newsuffix);
map.put("basepath", "upload/");
} catch (Exception e) {
e.printStackTrace();
} finally {
if (fos != null) {
fos.flush();
fos.close();
}
if (fis != null) {
fis.close();
}
}
return "toResult";
}
 
}


JQuery上传插件Uploadify使用详解

标签:ajax   上传图片   

原文地址:http://blog.csdn.net/u013628152/article/details/46483215

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!