通过createObjectURL拿到blob格式
file.name获取到上传的文件名
reader.result拿到data:image/png;base64格式
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<input type="file" id="btn" accept="image/*" value="点击上传" />
<img id="img" />
<script>
const btn = document.querySelector('#btn');
btn.addEventListener('change', function (e) {
let file = this.files[0];
console.log(this.files);
console.log(file.name);
console.log(URL.createObjectURL(file));
// 异步读取
const reader = new FileReader();
reader.readAsDataURL(file);
reader.onload = function () {
console.log(reader.result);
};
});
</script>
</body>
</html>
1万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
