请用html写一个程序,点击按钮从本地指定路径下读取图片并显示在页面上
时间: 2023-12-19 13:07:52 浏览: 38
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>读取本地图片</title>
</head>
<body>
<input type="file" id="fileInput">
<button onclick="loadImage()">读取图片</button>
<br><br>
<img id="image" src="" alt="">
<script>
function loadImage() {
var input = document.getElementById("fileInput");
var file = input.files[0];
var reader = new FileReader();
reader.onload = function() {
var image = document.getElementById("image");
image.src = reader.result;
}
reader.readAsDataURL(file);
}
</script>
</body>
</html>
相关推荐
![txt](https://img-home.csdnimg.cn/images/20210720083642.png)
![txt](https://img-home.csdnimg.cn/images/20210720083642.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![application/msword](https://img-home.csdnimg.cn/images/20210720083327.png)
![application/msword](https://img-home.csdnimg.cn/images/20210720083327.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![gz](https://img-home.csdnimg.cn/images/20210720083447.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)