Aspx code

<table>

        <tr>

            <td class="style3">

                <asp:Label ID="Label1" runat="server" Text="Photo upload" />

            </td>

            <td class="style4">

                <asp:FileUpload runat="server" ID="PhotoUpload" />

            </td>

            <td class="style4">

                <asp:Button runat="server" ID="btnPhotoPreview" Text="Preview" />

            </td>

            <td class="style1">

                <asp:Image runat="server" ID="ImagePreview" Height="164px" Width="125px" />

            </td>

        </tr>

    </table>

2.添加一个ID为btnPhotopreview的Button按钮

<asp:Button runat="server" OnClick="btnPreview_Click" ID="btnPhotoPreview" Text="Preview" />

3

.添加一个 .ashx文件,ashx是什么文件?

.ashx 文件用于写web handler的。.ashx文件与.aspx文件类似,可以通过它来调用HttpHandler类,它免去了普通.aspx页面的控件解析以及页面处理的过程。其实就是带HTML和C#的混合文件。
.ashx文件适合产生供浏览器处理的、不需要回发处理的数据格式,例如用于生成动态图片动态文本等内容。
<%@ WebHandler Language="C#" Class="ImageHandler" %>

using System;
using System.Web; public class ImageHandler : IHttpHandler, System.Web.SessionState.IRequiresSessionState
{ public void ProcessRequest (HttpContext context) {
//Checking whether the imagebytes session variable have anything else not doing anything if ((context.Session["ImageBytes"]) != null)
{
byte[] image = (byte[])(context.Session["ImageBytes"]);
context.Response.ContentType = "image/JPEG";
context.Response.BinaryWrite(image);
}
} public bool IsReusable {
get {
return false;
}
} }

4.双击button按钮注册事件。

protected void btnPreview_Click(object sender, EventArgs e)

    {

        Session["ImageBytes"] = PhotoUpload.FileBytes;

        ImagePreview.ImageUrl = "~/ImageHandler.ashx";

    }

参考:

http://www.c-sharpcorner.com/uploadfile/1a81c5/previewing-image-in-asp-net-image-control/

asp.net预览图片的更多相关文章

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

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

  2. FileUpload控件预览图片

    HTML代码: <tr> <td class="auto-style1">上传图片:</td> <td> <asp:FileU ...

  3. hTML5实现表单内的上传文件框,上传前预览图片,针刷新预览images

    hTML5实现表单内的上传文件框,上传前预览图片,针刷新预览images, 本例子主要是使用HTML5 的File API,建立一個可存取到该file的url, 一个空的img标签,ID为img0,把 ...

  4. [js/jquery]移动端手势拖动,放大,缩小预览图片

    摘要 有这样的需求需要在手机端预览图片的时候,实现图片的手势拖动,放大缩小功能.最终通过touch.js这个插件实现了效果. touch.js Touch.js是移动设备上的手势识别与事件库, 由百度 ...

  5. ftp如何预览图片 解决方案

    下载使用 server-U ,开启 HTTP 服务,输入 http://ip:端口 后,登录ftp账号密码,可选使用 基于java的应用 web client 或 FTP Voyager JV,来预览 ...

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

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

  7. js矩阵菜单或3D立体预览图片效果

    js矩阵菜单或3D立体预览图片效果 下载地址: http://files.cnblogs.com/elves/js%E7%9F%A9%E9%98%B5%E8%8F%9C%E5%8D%95%E6%88% ...

  8. input file 模拟预览图片。

    首先申明,接下来内容只是单纯的预览图片,最多选择九张,并没有和后台交互,交互的话需要自己另外写js. 本来想写一个调用摄像头的demo,意外的发现input file 在手机端打开的话,ios可以调用 ...

  9. Html5选择图片并及时预览图片

    以往想要实现图片预览基本都是先传至服务器后等返回链接地址才能进行预览,使用Html5选择图片并及时预览图片的代码如下,使用起来更爽了. <!DOCTYPE html> <html l ...

随机推荐

  1. OpenStack开启sshd

    修改配置sshd的文件 1.      修改sshd配置文件 /etc/ssh/sshd_config 2.      将#PasswordAuthentication no的注释去掉,并将no改为y ...

  2. IE 下a标签在 position:absolute 后无法点击的问题

    IE 下 a 标签在 position:absolute 后无法点击的问题 条件 : DOCTYPE 为 XHTML. IE 浏览器 现象 : 将 a 的 position 指定为 absolute, ...

  3. CentOS 安装nload(流量统计)

    yum install gcc gcc-c++ ncurses-devel wget http://www.roland-riegel.de/nload/nload-0.7.2.tar.gz tar ...

  4. 视频编解码学习之路(H264)

    学习视频编解码技术很难吗?视频编解码技术的未来是什么? 明了的说,无论是软件还是硬件设计,视频编解码技术有很多难点,都需要很长一段时间积累才行. 从一开始接触MPEG-2到最新的H.264标准,可算走 ...

  5. 12款令程序员惊叹的CSS3效果库

    最新的CSS3都配备了新的特性,来设计创建动画和互动的网页.在本文中,可以找到一些非常优秀的CSS3效果库,来让你的Web设计看起来更加引人注目.还在等什么?让我们一起看起来吧! Animate.cs ...

  6. ipa 重签

    IPA 重签名 时间 2014-03-03 10:28:36  txx's blog原文  http://blog.rpplusplus.me/blog/2014/03/03/ipa-re-codes ...

  7. iOS集成微信支付

    微信支付的开发 前言:之前听说过微信支付有很多坑,其实没有想象的那么坑,整体感觉很容易上手,按照它的流程来不会有错!PS:官方的流程看的TMD烦,好啦,废话有点多,进入开发.(ps:每个微信的版本一直 ...

  8. 总结PHP中几种常用的网页跳转代码

    网页跳转的意思就是指当你在浏览器中访问A页面时,会自动跳转到B页面,往往网页跳转用在404页面中会比较多点.至于怎么实现网页跳转,网上已经提供了很多的方法,有些方法是不可行的,经过测试,叶德华今天就在 ...

  9. Hibernate摘记

    原理: 1.通过Configuration().configure();读取并解析hibernate.cfg.xml配置文件2.由hibernate.cfg.xml中的<mapping reso ...

  10. mysql memcache

    http://blog.csdn.net/newjueqi/article/details/8350643