<body>
<input type="file" id="inp" multiple>
<script>
let inp = document.getElementById('inp')
inp.onchange = function(e){
console.log(e)
let filesList = this.files
for (let i = 0; i < filesList.length; i++) {
let formData = new FormData() // 表单对象
formData.append('imgData', filesList[i]) // imgData 命名
let xhr = new XMLHttpRequest()
// 上传的进度条
console.log(xhr.upload)
/*
onabort: null // 取消
onerror: null // 报错
onload: null // 成功之后
onloadend: null // 结束之后
onloadstart: null // 开始加载
onprogress: null // 进度
ontimeout: null // 延迟
*/
// 监听进度
xhr.upload.onprogress = function(e){
console.log(e.loaded) // 上传多少数据
console.log(e.total) // 总大小
let biLi = e.loaded/e.total * 100 + '%' // 算出比例
}
xhr.open('post', './upload.php', true)
xhr.send(formData)
xhr.onreadystatechange = function(){
}
}
}
</script>
</body>
图片上传
最后编辑于 :
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。