# 上傳文件獲取base64 ~~~ let uploading = false // #file 文件上傳框 $('#file').change(function(e)?{ if?(uploading)?{ //　正在上傳 return } uploading?=?true; letfile?=?e.currentTarget.files\[0\]; lettype?=?getType(file.name).toUpperCase(); // 判斷文件類型 if?(!types.includes(type))?{ //?類型不合 uploading?=?false; //?提示 return?; ?} console.log(file); if?(window.FileReader)?{ let fr?=?newFileReader(); fr.onloadend?=?function(e)?{ //?上傳結束觸發 console.log(e); ????????????????} //?進度初始值 letproNum?=?0 //?文件開始上傳 fr.onloadstart?=?function()?{ //?顯示進度條 $('#file\_progress').show(); //?進度條初始化 $('#progress').val(proNum); $('#progress\_num').html(proNum?+?'%'); ????????????????} fr.onprogress?=?function(e)?{ //?計算進度條百分比 proNum?=?e.loaded/file.size?\*?100; proNum?=?Math.floor(proNum); //?設置進度條值 $('#progress').val(proNum); $('#progress\_num').html(proNum?+?'%'); //?當進度條到100%后隱藏?并顯示文件信息 if?(proNum?==?100)?{ uploading?=?false; setTimeout(function()?{ $('#file\_progress').hide(); ?},?500) $('#filetype').html(type); if?(type?==?'ZIP'?||?type?==?'RAR')?{ $('#filetype').css('background-image',?"url('{v8-path}style/img/tool/zip.png')") ?} if?(type?==?'PDF'?||?type?==?'PPT')?{ $('#filetype').css('background-image',?"url('{v8-path}style/img/tool/pdf.png')") ??} if?(type?==?'DOC'?||?type?==?'DOCX')?{ $('#filetype').css('background-image',?"url('{v8-path}style/img/tool/doc.png')") ????????????????????????} if?(type?==?'XLSX')?{ $('#filetype').css('background-image',?"url('{v8-path}style/img/tool/xlsx.png')") } $('#filename').html(file.name); letsize?=?getSize(file.size); $('#filesize').html(size); $('#fileRes').show(); ????????} ?} fr.onload?=?function(e)?{ //?console.log(this.result); if?(!this.result)?{ //?彈窗提示失敗 }?else?{ //?上傳成功 console.log('上傳成功') fileData?=?this.result; ? } ?} fr.onerror?=?function(e)?{ //?上傳出錯時觸發 console.log(e) ?} fr.onabort?=?function(e)?{ //?中斷時觸發 console.log(e) ??} //?獲取文件base64 fr.readAsDataURL(file); ??}?else?{ //?瀏覽器不支持 console.log('瀏覽器不支持fileReader'); ?} ~~~