图片预览图片预览--js
root
abc abc
- 13 Jul
<html>
<head>
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no">
<title>图片预览图片预览</title>
</head>
<body>
<input type="file" onchange="previewFile()" /><br />
<img src="" height="200" alt="图片预览" />
<script type="text/javascript">
function previewFile() {
const preview = document.querySelector("img");
const file = document.querySelector("input[type=file]").files[0];
const reader = new FileReader();
reader.addEventListener(
"load",
() => {
// 将图像文件转换为 Base64 字符串
preview.src = reader.result;
},
false,
);
if (file) {
reader.readAsDataURL(file);
}
}
</script>
</body>
</html>
root moved this 3 months, 3 weeks ago