<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
</head>
<body>
<div>
<form>
<input type="file" id="file-input" name="fileContent">
<button onclick="getText()">上傳</button>
</form>
</div>
</body>
<script type="text/javascript">
var data_64; //表單隱藏域的Base64碼值
$(document).ready(function(){
$("#file-input").change(function(e){
var file = e.target.files[0];
var reader = new FileReader();
reader.readAsDataURL(file); //讀出 base64
reader.onloadend = function () {
// 圖片的base64值
data_64= reader.result.substring(reader.result.indexOf(",")+1);
console.log(data_64)
};
});
});
/**
* 發送Ajax請求
* */
function getText() {
$.ajax({
type:"POST",
dataType:"JSON",
data:"file_base64="+data_64,
url:"url",
timeout:10000,
success:function (message) {
console.log(message)
},
error:function (e) {
alert("請求錯誤");
}
});
return false;
}
</script>
</html>
JQ將文件轉成base64上傳demo
發表評論
所有評論
還沒有人評論，想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章