1.使用环境
1> jar包：
commons-fileupload-1.2.2.jar
commons-io-2.4.jar
2> js
handlers.js
swfupload.js
swfupload.swf
3> css
button.css
default.css
建议:下载一个demo，然后把所需要的jar包和样式拷贝到项目里，如果后期嵌入项目的样式不符合要求，可以根据客户需求来更改。
2.嵌入到项目
1> jsp页面
1.1> js引入到jsp页面
<script type="text/javascript" src="js/jquery-1.6.2.min.js"></script>
<script type="text/javascript" src="js/swfupload/swfupload.js"></script>
<script type="text/javascript" src="js/swfupload/handlers.js"></script>
1.2> js函数
<script type="text/javascript">
var swfu;
$(document).ready(function(){
swfu = new SWFUpload({
upload_url:'url',//url地址，指向后台
post_params: {"param1":"param1","param2":"param2"}, //参数以json格式传递
use_query_string:true,
// File Upload Settings
file_size_limit : "10 MB", // 文件大小控制
file_types : "*.*",
file_types_description : "All Files",
file_upload_limit : "0",
file_queue_error_handler : fileQueueError,
file_dialog_complete_handler : fileDialogComplete,//选择好文件后提交
file_queued_handler : fileQueued,
upload_progress_handler : uploadProgress,
upload_error_handler : uploadError,
upload_success_handler :uploadSuccess,
upload_complete_handler : uploadComplete,
button_placeholder_id : "spanButtonPlaceholder",
button_ 200,
button_height: 25,
button_text : '<span class="button">点击此处选择文件 </span>',
button_text_style : '.button { font-family: 微软雅黑, Arial, sans-serif; font-size: 12pt; } .buttonSmall { font-size: 12pt; }',
button_text_top_padding: 0,
button_text_left_padding: 18,
button_window_mode: SWFUpload.WINDOW_MODE.TRANSPARENT,
button_cursor: SWFUpload.CURSOR.HAND,
// Flash Settings
flash_url : "js/swfupload/swfupload.swf",
custom_settings : {
upload_target : "divFileProgressContainer"
},
// Debug Settings
debug: false //是否显示调试窗口
});
});
//点击上传按钮，实现多文件上传
function startUploadFile(){
var infoTable = document.getElementById("infoTable");
var rows = infoTable.rows; //获取行
var cell = rows[1].cells; //获取第一行的列
var concent = cell[2].innerHTML;//获取第一行第三列的值
var btnCancel=document.getElementById("btnCancel");
if(concent!=null){
$(btnCancel).hide();
}else{
$(btnCancel).show();
}
swfu.startUpload();
}
</script>
1.3> 页面布局
<body style=" padding: 2px;">
<div id="content">
<div style="margin:0px auto;370px;height:31px; border: 1px #c3c3c3 solid; ">
<div style="float:right;">
<input id="btnUpload" type="button" value="上 传" style="margin-right: 2px;margin-top:3px;height: 24px"
onclick="startUploadFile()"/>
<input id="btnCancel" type="button" value="取消所有上传" onclick="cancelUpload()" style="margin-right: 2px;height: 24px"
disabled="disabled"/>
</div>
<div style="position: absolute;margin-top:5px"><span id="spanButtonPlaceholder"></span></div>
</div>
<table width="540px" id="infoTable" border="0">
<tr style="height: 0px"><th width="125px"></th><th></th><th width="100px"></th><th width="40px"></th></tr>
</table>
<div id="divFileProgressContainer"></div>
</div>
</body>
2> 代码
response.setContentType("text/html;charset=utf-8");
MultipartHttpServletRequest multipartRequest = (MultipartHttpServletRequest)request;
Map<String, MultipartFile> fileMap = multipartRequest.getFileMap();
//获取文件名
String fileNameAll = fileMap.get("Filedata").getOriginalFilename();
//文件内容
byte [] postData = fileMap.get("Filedata").getBytes();
//具体的业务代码