input file 图片上传展示重新上传

html

                         <div>
                             <label class="imgMark">说明:</label>
                             <div class="erWeiMa">
                                 <img src="" class="imgShow" >
                                 <img src="upload.png">
                                 <input  type="file" class="file"   >  
                             </div>
                         </div>

js

$(".file").change(function(){

    $(this).prev().css("display","none");
    $(this).prev().prev().css("display","block");//获取上传的图片信息
       var file=$(this).get(0).files[0];
      //创建用来读取此文件的对象
      var reader=new FileReader();
      //使用该对象读取此文件的方法函数
      reader.readAsDataURL(file);
      //读取文件成功后执行的方法函数
      reader.onload=function(e){
         $(".imgShow").attr("src",e.target.result)
      }
});

 

posted @ 2018-04-12 13:08  pengc  阅读(310)  评论(0编辑  收藏  举报