Atitit .h5文件上傳 1. 上傳原理1 2. Html1 3. Js2 4. uploadV2.js2 5. upServlet & FileUploadService {3 6. 註意::去除struts的干擾3 7. 參考3 1. 上傳原理 FormData + apache io 2. ...
Atitit .h5文件上傳
5. upServlet & FileUploadService {3
1. 上傳原理
FormData + apache io
2. Html
<script type="text/javascript" src="../com.attilax/io/uploadV2.js">
<input id="filex" type="file" name="fileField" style="display:nonex" onchange="uploadSrv.upload()"/>
<div id="uppic_btn" name="btn" type="button" style=" margin-top:0px ; height:30px ; background-color:#0AEAFD " onclick="custom_browserBtn_click();" >瀏覽按鈕
<!-- process bar q414 add recomm-->
<div id="process_div"></div>
</div>
作者:: ★(attilax)>>> 綽號:老哇的爪子 ( 全名::Attilax Akbar Al Rapanui 阿提拉克斯 阿克巴 阿爾 拉帕努伊 ) 漢字名:艾龍, EMAIL:[email protected]
轉載請註明來源: http://www.cnblogs.com/attilax/
3. Js
<script defer>
// $app_path="/lime"; for test
var saveDir="00upQ4";
saveDir=encodeURIComponent(saveDir);
var uploadSrv=new AtiUpload();
uploadSrv.up_url=$approot+"/upServlet?savepath="+saveDir;
uploadSrv.upload_finish_handler=function(data){
alert("上傳結束返回結果:"+data);
};
function custom_browserBtn_click()
{
$("#filex").click();
}
</script>
4. uploadV2.js
// JavaScript Document
function AtiUpload()
{
this.up_url;
this.upload_finish_handler;
}
AtiUpload.prototype. upload=function()
{
var self=this;
try{
$("#process_div").progressBar(99);
}catch(e){
console.log(e);
}
var fd = new FormData();
//fd.append("upload", 1);
fd.append("upfile", $("#filex").get(0).files[0]);
$.ajax({
url: this.up_url,
type: "POST",
processData: false,
contentType: false,
data: fd,
success: function(d) {
console.log(d);
console.log("----fini");
//$("#file_val").val(d);
// writeCookie("file_url_frmJS",$("#file_val").val(),10);
self.upload_finish_handler(d);
upload_finish();
}
});
}
5. upServlet & FileUploadService {
6. 註意::去除struts的干擾
當項目有struts框架,配置了監控所有的url /*的時候 (預設)。。會獲取不到數據,需要去除struts的干擾
<constant name="struts.action.excludePattern" value="/upServlet,
7. 參考
Pinnge p2.html
D:\wamp\www\lime\com.attilax\io