FileUpload控件预览图片
HTML代码:
<tr>
<td class="auto-style1">上传图片:</td>
<td>
<asp:FileUpload ID="FileUpload1" runat="server" onchange="chgImg(this)"/>
<div>
<img src="" id="Photo" runat="server" style="max-height:80px"/>
<div>
<div id="preview"></div>
<p>图片路径:<asp:Label ID="lalimageUrl" runat="server" Text=""></asp:Label></p>
</td>
</tr>
JS 代码:
function chgImg(file){
//img控件预览图片
var FileUpload1=$("#FileUpload1").val();
$("#Photo").attr("src","file:///" +FileUpload1);
//div预览图片(兼容模式)
var prevDiv=document.getElementById('preview');
if(file.files && file.files[]){
var reader=new FileReader();
reader.onload=function(evt){
prevDiv.innerHTML='<img src="'+evt.target.result+'" style="max-height:80px"/>';
}
reader.readAsDataURL(file.files[]);
}
else
{
prevDiv.innerHTML='<div class ="img" style="max-height:80px;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale,src=\''+file.value+'\')"></div>';
}
}
FileUpload控件预览图片的更多相关文章
- winform使用Barcodex控件预览和打印一维码
1.控件下载. http://files.cnblogs.com/files/masonblog/barcodex.zip . 包含barcodex.ocx控件.barcodex帮助文档.两个winf ...
- FileUpload控件实现单按钮图片自动上传并带预览显示
FileUpload控件实现单按钮图片自动上传并带预览显示 1.实现原理: FileUpload控件默认不支持服务端的ONCHANGE事件,此时用一种变通的方法借用客户端的onchange事件,调 ...
- Asp.net中FileUpload控件实现图片上传并带预览显示
单一图片上传——“选择”+“上传”,.NET默认模式: 1.实现原理: 采用FileUpload控件默认的使用方式,先由“选择”按钮选择图片,然后单击“上传”按钮完成上传,并可在“上传”按钮的 ...
- [.ashx檔?泛型处理例程?]基础入门#2....FileUpload上传前,预览图片(两种作法--ashx与JavaScript)
原文出處 http://www.dotblogs.com.tw/mis2000lab/archive/2013/08/20/ashx_beginner_02_fileupload_picture_p ...
- 微信开发中使用微信JSSDK和使用URL.createObjectURL上传预览图片的不同处理对比
在做微信公众号或者企业微信开发业务应用的时候,我们常常会涉及到图片预览.上传等的处理,往往业务需求不止一张图片,因此相对来说,需要考虑的全面一些,用户还需要对图片进行预览和相应的处理,在开始的时候我使 ...
- 本地预览图片html和js例子
本地预览图片html和js例子,直接上代码吧. <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml" ...
- javascript预览图片——IT轮子系列(九)
再使用htm控件 <input type="file" name="file" /> 上传图片的时候,往往需要先预览图片,然后点击保存按钮,把图片上 ...
- FileUpload控件使用初步
FileUpload控件使用初步 FileUpload控件使用初步: 1.实现文件上传 protected void btnSubmit_click(object sender, EventArg ...
- webform FileUpload控件实例应用 上传图片
首先在根目录下建一个"images"文件: HTML: <form id="form1" runat="server"> < ...
随机推荐
- BZOJ1797 [Ahoi2009]Mincut 最小割 【最小割唯一性判定】
题目 A,B两个国家正在交战,其中A国的物资运输网中有N个中转站,M条单向道路.设其中第i (1≤i≤M)条道路连接了vi,ui两个中转站,那么中转站vi可以通过该道路到达ui中转站,如果切断这条道路 ...
- 浅谈后缀自动机SAM
一下是蒟蒻的个人想法,并不很严谨,仅供参考,如有缺误,敬请提出 参考资料: 陈立杰原版课件 litble 某大神 某大神 其实课件讲得最详实了 有限状态自动机 我们要学后缀自动机,我们先来了解一下自动 ...
- Python Spider
一.网络爬虫 网络爬虫又被称为网络蜘蛛(
- linux磁盘挂载流程
参考 [https://www.jianshu.com/p/ea57fb7834f2]
- [AGC016B] Colorful Hats (结论)
Description 有n个人,每个人都戴着一顶帽子.当然,帽子有不同的颜色. 现在,每个人都告诉你,他看到的所有其他人的帽子共有多少种颜色,请问你有没有符合所有人的描述的情况. Input 第一行 ...
- OpenGL ES 画直线代码实例
http://blog.csdn.net/yexiaozi_007/article/details/7978620 以画xyz坐标轴为例,很多人会遇到用glcolor设置了颜色,但是直线画出来还是黑色 ...
- 【原创】Javascript-获取URL请求参数
function getUrlParam() { var param = [], hash; var url = window.location.href;//获取网页的url var hashes ...
- Word Break - LeetCode
Given a string s and a dictionary of words dict, determine if s can be segmented into a space-separa ...
- luogu P2744 [USACO5.3]量取牛奶Milk Measuring
题目描述 农夫约翰要量取 Q(1 <= Q <= 20,000)夸脱(夸脱,quarts,容积单位——译者注) 他的最好的牛奶,并把它装入一个大瓶子中卖出.消费者要多少,他就给多少,从不有 ...
- 某考试 T1 monopoly
可以很容易的发现,如果选了最高的房子,那么就不能再选了:否则在左边选一坨合法的,在右边选一坨合法的,拼起来还是合法的. 所以我们可以处理出,每个数的控制区间[L,R] (保证这个区间是其他数都小于它的 ...