利用JQuery实现 点击图片预览 模拟点击input上传图片预览

在一般项目中都会遇到前台图片预览但是并不需要上传，正好在项目中写到了这里并记录下

首先我们要引用JQuery 

<script src=“https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js”></script>

然后我们需要写一个File类型的input以及一个预览图片的 img标签，并分别设置ID

<input type="text" name="" id='input_id'>
<img id="box" src=""   onclick="preview('input_id','box')">

然后我们在加入JS脚本用于运行点击上传提前预览图片

function preview(id,img){
    //模拟点击INPUT 
    $("#"+id).click();
        //将图片预览到指定区域
    $("#"+id).change(function () {
            //创建blob对象，浏览器将文件放入内存中，并生成标识
            var img_src = URL.createObjectURL($(this)[0].files[0]);
            //给img标检的src赋值
            document.getElementById(img).src=img_src;
            //URL.revokeObjectURL(img_src);// 手动 回收，
	});
}