1. 程式人生 > >Excel文件上傳功能實現

Excel文件上傳功能實現

return size access 信息 format 上傳失敗 index cli img

技術分享圖片

$(function(){
let file;
//上傳點擊事件
$(‘#btn‘).bind(‘click‘, function(){
let val = $(‘#fb‘).filebox(‘getText‘);
if(!val){
return alert(‘未選擇任何文件!‘)
}
let reg = /\.(xlsx|xls)/i;
if(reg.test(val)){
let formData = new FormData();
formData.append("upfile", file); //upfile 後臺接收的參數名
$.ajax({
url: ‘‘, //url地址,向後臺請求的,該是什麽寫什麽
type: ‘POST‘,
data: formData,
async: false,
cache: false,
contentType: false,
processData: false,
beforeSend: function(xhr) {
if (accesstoken && username && userid) {//用戶信息,一般記錄是session裏面
xhr.setRequestHeader("AccessToken",
accesstoken);
xhr.setRequestHeader("username", username);
xhr.setRequestHeader("userid", userid);
}
},
success: function (res) {
if(!res || res.hasError && res.error.indexOf(‘請重新登錄‘) >= 0){
$UToolNoCache();//清楚緩存的封裝方法,需要的自己寫邏輯
return;
}
if(res && res.hasError){
return alert(`上傳失敗:<br/> ${res.error}`);
}else{
return alert(‘上傳成功!‘);
}
},
error: function (res) {
console.log(res);
return alert(‘請求發送失敗!‘);
}
});

}else{
$(‘#fb‘).filebox(‘setText‘,‘‘);
return alert(‘請選擇正確的Excel文件!‘);
}
});
//文件判斷
$(‘:file‘).change(function(){
file = this.files[0];
// let name = file.name;
// let size = file.size;
let type = file && file.type;
if(type !== ‘application/vnd.openxmlformats-officedocument.spreadsheetml.sheet‘ && type !== ‘application/vnd.ms-excel‘){
                   return alert(‘此處應選擇Excel文件!‘);
        }
});
});

Excel文件上傳功能實現