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控件预览图片的更多相关文章

  1. winform使用Barcodex控件预览和打印一维码

    1.控件下载. http://files.cnblogs.com/files/masonblog/barcodex.zip . 包含barcodex.ocx控件.barcodex帮助文档.两个winf ...

  2. FileUpload控件实现单按钮图片自动上传并带预览显示

    FileUpload控件实现单按钮图片自动上传并带预览显示 1.实现原理:   FileUpload控件默认不支持服务端的ONCHANGE事件,此时用一种变通的方法借用客户端的onchange事件,调 ...

  3. Asp.net中FileUpload控件实现图片上传并带预览显示

    单一图片上传——“选择”+“上传”,.NET默认模式: 1.实现原理:     采用FileUpload控件默认的使用方式,先由“选择”按钮选择图片,然后单击“上传”按钮完成上传,并可在“上传”按钮的 ...

  4. [.ashx檔?泛型处理例程?]基础入门#2....FileUpload上传前,预览图片(两种作法--ashx与JavaScript)

    原文出處  http://www.dotblogs.com.tw/mis2000lab/archive/2013/08/20/ashx_beginner_02_fileupload_picture_p ...

  5. 微信开发中使用微信JSSDK和使用URL.createObjectURL上传预览图片的不同处理对比

    在做微信公众号或者企业微信开发业务应用的时候,我们常常会涉及到图片预览.上传等的处理,往往业务需求不止一张图片,因此相对来说,需要考虑的全面一些,用户还需要对图片进行预览和相应的处理,在开始的时候我使 ...

  6. 本地预览图片html和js例子

    本地预览图片html和js例子,直接上代码吧. <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml" ...

  7. javascript预览图片——IT轮子系列(九)

    再使用htm控件 <input type="file" name="file" /> 上传图片的时候,往往需要先预览图片,然后点击保存按钮,把图片上 ...

  8. FileUpload控件使用初步

    FileUpload控件使用初步   FileUpload控件使用初步: 1.实现文件上传 protected void btnSubmit_click(object sender, EventArg ...

  9. webform FileUpload控件实例应用 上传图片

    首先在根目录下建一个"images"文件: HTML: <form id="form1" runat="server"> < ...

随机推荐

  1. 基于SSM3框架FreeMarker自定义指令(标签)实现

    通过之前的Spring MVC 3.0.5+Spring 3.0.5+MyBatis3.0.4全注解实例详解系列文章,我们已经成功的整合到了一起,这次大象将在此基础上对框架中的FreeMarker模板 ...

  2. SQL中的CASE WHEN使用

    原文发布时间为:2010-06-04 -- 来源于本人的百度文章 [由搬家工具导入] SQL的条件语句,条件判断语句,SQL的 if else语句。2009-07-20SQL_中的CASE WHEN使 ...

  3. javascript获取querystring值【个人觉得这种方法最好最棒最像.NET】

    原文发布时间为:2009-05-22 -- 来源于本人的百度文章 [由搬家工具导入] JavaScript获取QueryString值, 当没有QueryString值时输出bool型 null 用j ...

  4. 让你的qstardict读单词

    作为编程行当的人员,英语是躲不掉的,很多资料英文更加有效,字典就显得尤为重要,我希望字典不但能查到中文意思,还能发生,那就跟我来吧: 一.安装字典程序: pacman -S qstartdic sox ...

  5. ftk学习记(label篇)【转】

    转自:http://blog.csdn.net/feixiaoxing/article/details/25000093 版权声明:本文为博主原创文章,未经博主允许不得转载. [ 声明:版权所有,欢迎 ...

  6. hdu 3879 hdu 3917 构造最大权闭合图 俩经典题

    hdu3879  base station : 各一个无向图,点的权是负的,边的权是正的.自己建一个子图,使得获利最大. 一看,就感觉按最大密度子图的构想:选了边那么连接的俩端点必需选,于是就以边做点 ...

  7. Java IO 学习(三)缓冲IO / 直接IO / 内存映射

    缓冲IO 在介绍缓冲IO之前需要先了解一下常用的机械硬盘的原理与特点 一个机械硬盘中装有多个盘片 每个盘片上有多个同心圆(磁道) 每个同心圆又由多个弧(扇区)组成,每个弧上都记录了等量的数据(比方说5 ...

  8. Nginx修改版本信息或隐藏版本号

    一,隐藏版本号.首先说明,这个是某一方面隐藏,不是彻底隐藏.未隐藏之前查看nginx信息: 隐藏方法: 修改nginx.conf配置文件,在http { } 标签里边加入字段: server_toke ...

  9. UVA 10976 Fractions Again?!【暴力枚举/注意推导下/分子分母分开保存】

    [题意]:给你一个数k,求所有使得1/k = 1/x + 1/y成立的x≥y的整数对. [分析]:枚举所有在区间[k+1, 2k]上的 y 即可,当 1/k - 1/y 的结果分子为1即为一组解. [ ...

  10. UVA 11059 Maximum Product【三层暴力枚举起终点】

    [题意]:乘积最大的子序列.n∈[1,10],s∈[-10,10] [代码]: #include<bits/stdc++.h> using namespace std; int a[105 ...