预览图像文件上传 [英] Preview image file upload
本文介绍了预览图像文件上传的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我在asp.net中使用向导。
i在所有步骤上都有图像上传
用于显示图像我正在使用下面显示的脚本
i am using wizard in asp.net .
i have image upload on all steps
for display image i am using this script shown below
<script type="text/javascript">
function previewFile() {
var preview = document.querySelector('#<%=ImgFmlyPhoto.ClientID %>');
var file = document.querySelector('#<%=FUFmlymbr.ClientID %>').files[0];
var reader = new FileReader();
reader.onloadend = function () {
preview.src = reader.result;
}
if (file) {
reader.readAsDataURL(file);
} else {
preview.src = "";
}
}
</script>
<asp:FileUpload ID="FUFmlymbr" runat="server" onchange="previewFile()" type="file" name="file"/>
问题是当我在step1图片上浏览图片时显示但是当我转到第2步并再次进入第1步所以没有图像时。
请帮助.............
problem is when i browse image on step1 picture is displayed but when i go to step 2 and again i come to step 1 so there is no image.
please help .............
推荐答案
以为你需要这样的
http://www.aspdotnet-suresh.com/2014/03/jquery-preview-image-before-upload-using-fileupload.html [ ^ ]
AnandKumar Devendran
thought u need like this
http://www.aspdotnet-suresh.com/2014/03/jquery-preview-image-before-upload-using-fileupload.html[^]
AnandKumar Devendran
使用示例代码:
Use the Sample Code as :
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>jQuery Preview Image before upload</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script>
<script type="text/javascript">
function Preview(input) {
if (input.files && input.files[0]) {
var filerdr = new FileReader();
filerdr.onload = function(e) {
('#imgprvw')。attr('src',e.target.result);
}
filerdr.readAsDataURL(input.files [0]);
}
}
< / script>
< / head>
< body>
< form id =form1runat =server>
< input type =filename =filUploadid =filUploadonchange =Preview(this)/>
< / form>
< / body>
< / html>
('#imgprvw').attr('src', e.target.result); } filerdr.readAsDataURL(input.files[0]); } } </script> </head> <body> <form id="form1" runat="server"> <input type="file" name="filUpload" id="filUpload" onchange="Preview(this)" /> </form> </body> </html>
这篇关于预览图像文件上传的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文