使用javascript或jquery在文件上传之前显示图像预览 [英] Show image preview before file upload using javascript or jquery

问题描述

嗨

我想在图片上传之前显示图片预览



任何人都知道如何使用javascript或jquery



先谢谢

解决方案

 <   script  >  
函数readURL（输入）{
 if（input.files&& input.files [0]）{
 var reader = new FileReader（）; 
 reader.onload = function（e）{

（'＃blah'）。attr（'src'，e.target.result）;
}

reader.readAsDataURL（input.files [0]）;
}
}

（＃filePhoto）。change（function（）{
readURL（this）;
}）;
< / script >


< div >
< asp：FileUpload ID = FilePhoto runat = server CssClass < span class =code-keyword> = fileupload onchange = readURL（this ） / > < br / >
< img id = blah src = ＃ alt = 预览 width = 100\" height = < span class =code-keyword> 100 / >
< / div >

Hi
I want to show image preview before image get upload

Anyone have any idea how to implement this with using javascript or jquery

Thanks in Advance

解决方案

<script>
       function readURL(input) {
           if (input.files && input.files[0]) {
               var reader = new FileReader();
               reader.onload = function(e) {

('#blah').attr('src', e.target.result); } reader.readAsDataURL(input.files[0]); } }

("#filePhoto").change(function() { readURL(this); }); </script> <div> <asp:FileUpload ID="FilePhoto" runat="server" CssClass="fileupload" onchange="readURL(this)" /><br /> <img id="blah" src="#" alt="Preview" width="100" height="100" /> </div>

这篇关于使用javascript或jquery在文件上传之前显示图像预览的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！