JavaScript 实现图片预览

最新推荐文章于 2024-06-20 10:53:59 发布

wucong60

最新推荐文章于 2024-06-20 10:53:59 发布

阅读量594

点赞数

分类专栏： JavaScript

本文链接：https://blog.csdn.net/wucong60/article/details/84641769

版权

JavaScript 专栏收录该内容

8 篇文章 0 订阅

订阅专栏

效果如下图：

直接上代码：

<input type="file" id="myfiles"/>

<button onclick="upload()">Upload</button>
<img id="image" />


<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
<script>
function upload(){
var URL = window.URL || window.webkitURL;
var myfile=document.getElementById("myfiles");
var f=myfile.files[0];
	var result = URL.createObjectURL(myfile.files[0]);
	console.log(result);
	console.log(f.name,f.type);
	
	var $image = $('#image');
	$image.attr('src',result);
}
</script>