<input type="file" name="photo" id="imgOne" style="display: none" onchange="preImg(this.id,'photo');"
       accept="image/jpeg, image/jpg, image/png"/>
<img id="photo" src="" style="display: block;max-width:300px; vertical-align:middle; max-height: 300px"/>
<script>
function preImg(sourceId, targetId) {

	//获取文件
    var file = document.getElementById(sourceId).files[0];
 
    //创建读取文件的对象
    var reader = new FileReader();
 
    //创建文件读取相关的变量
    var imgFile;
 
    //为文件读取成功设置事件
    reader.onload=function(e) {
        imgFile = e.target.result;
        var url = imgFile;
    	var imgPre = document.getElementById(targetId);
    	imgPre.src = url;
    	document.getElementById("load").style.display = "none";//隐藏
    	document.getElementById("cropSection").style.display = "";//显示
    };
 
    //正式读取文件
    reader.readAsDataURL(file);
}
</script>