uploadify上传

 一、上传按钮样式

1.1id="show_filebutton"是显示给用户操作按钮，id="filebutton"是flash上传按钮完成用户上传操作。id="show_filebutton"按钮样式不需要变，只需要将id="filebutton"按钮覆盖在id="show_filebutton"按钮上面就行了。

1.2uploadify会生成自己的html元素class="swfupload"

<html>

<body>

<head>

<style>

.swfupload{background:red;}  //设置flash上传按钮背景颜色。可以看到按钮方便设置宽高等css属性

.swfupload{width: 120px;height: 35px; top: -35px;left: 50px;opacity:0;}    //flash上传按钮覆盖美工提供过来的上传按钮,uploadify上传按钮本身就是透明不可见，这样方便我们覆盖在按钮上面达到效果

</style>

</head>

<button id="show_filebutton" type="button">导入数据文件</button>
<button type="button" id="filebutton"></button>

</body>

</html>

 

二、绑定上传按钮事件

$(document).ready(function(){      

$("#filebutton").uploadify({
'swf' : '/plugin/uploader/uploadify.swf',
'uploader' : '/simple/upload.do',
'buttonClass' : 'upload',
'buttonText' : '',
'width': 'auto',
'queueID' : "upload_queue",
'auto' : false,
'fileObjName' : 'uploads',
'multi' : false, //多文件上传
'fileSizeLimit' : 2048 , //限制文件的大小，默认单位是KB
'uploadLimit' : 1,
'fileTypeDesc' : '支持资源格式：',
'fileTypeExts' : '*.xls;*.xlsx;',
'onUploadStart' : function(file){
$('#filebutton').uploadify("settings", "formData", {para:1});
},
'onUploadSuccess' : function(file, data, response) {
var uploadLimit = $("#filebutton").uploadify('settings', 'uploadLimit'); //get
$("#filebutton").uploadify('settings', 'uploadLimit', uploadLimit+1); //set
$("#downloadfilename").val(data);
}
});

});

java上传代码

public class Upload(){ 

public void uploadImage(){
UUID uuid = UUID.randomUUID();
String sysPath = getSession().getServletContext().getRealPath("");
File tempFile = new File(sysPath+"/upload/temp/");
if(!tempFile.exists()){
tempFile.mkdirs();
}
UploadFile upfile = getFile("image");
if(upfile != null){
File file = upfile.getFile();
String fileName = uuid+"_"+file.getName();
String filepath = "/upload/temp/"+fileName;
file.renameTo(new File(sysPath+filepath));
setAttr("filepath", filepath);
}
renderJson();
}

}

posted @ 2016-06-27 10:06  N神3  阅读(216)  评论(0)  编辑  收藏  举报