最近在寫單檔案上傳,用jQuery File Upload踩了好多坑,但終于實作了單檔案,通過按鈕送出。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html >
<head>
<meta charset="UTF-8">
<title>測試jqueryUploadFile</title>
<script src="js/jquery.min.js"></script>
<script src="js/jquery.ui.widget.js"></script>
<script src="js/jquery.iframe-transport.js"></script>
<!--不跨域可不用xdr-transport-->
<script src="js/jquery.xdr-transport.js"></script>
<script src="js/jquery.fileupload.js"></script>
</head>
<body>
<input type="file" id="uploadFile" name="uploadFile">
<input type="button" id="uploadFileButton" value="上傳檔案"/>
<script>
$(function () {
$('#uploadFile').fileupload({
replaceFileInput:false, //顯示所選擇的檔案名
autoUpload: false, //不自動上傳
url: 'http://localhost:8080/uploadFile',//請求的伺服器位址
dataType: 'text', //響應的json或者文本
add:function (e,data) {
//綁定上傳按鈕的click事件,為了避免重複click,先解綁,再綁定
$('#uploadFileButton').off('click').on('click',function () {
data.submit()
})
},
done: function (e, data) {
console.log('done' + data)
}
})
})
</script>
</body>
</html>