$("#fuPoster").change(function (event) { //根据这个 <input> 获取文件的 HTML5 js 对象 var files = event.target.files, file; if (files && files.length > 0) { // 获取目前上传的文件 file = files[0]; // 来在控制台看看到底这个对象是什么 console.log(file); // 那么我们可以做一下诸如文件大小校验的动作 if (file.size > 1024 * 1024 * 5) { alert('图片大小不能超过 5MB!'); return false; } // !!!!!! // 下面是关键的关键,通过这个 file 对象生成一个可用的图像 URL // 获取 window 的 URL 工具 var URL = window.URL || window.webkitURL; // 通过 file 生成目标 url var imgURL = URL.createObjectURL(file); $("#imgPoster").attr("src", imgURL); } })
思路是这样的,通过上面代码就已经预览到图片,那么就能获取到这个图片的src,那么就能把这个src替换掉需要替换的img上,分享到此结束。