一、建立Default.aspx页面

  1. <%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Default.aspx.cs" Inherits="_Default" %>
  2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  3. <html xmlns="http://www.w3.org/1999/xhtml">
  4. <head runat="server">
  5. <title>ajax图片上传</title>
  6. <script src="js/jquery-1.3.2.min.js" type="text/javascript"></script>
  7. <script src="js/jquery.form.js" type="text/javascript"></script>
  8. <script type="text/javascript">
  9. function upload(){
  10. var path = document.getElementById("File1").value;
  11. var img = document.getElementById("img1");
  12. if($.trim(path)==""){
  13. alert("请选择要上传的文件");
  14. return;
  15. }
  16. $("#form1").ajaxSubmit({
  17. success: function (str) {
  18. if(str!=null && str!="undefined"){
  19. if (str == "1") {alert("上传成功");document.getElementById("img1").src="data:images/logo.jpg?"+new Date();/*上传后刷新图片*/}
  20. else if(str=="2"){alert("只能上传jpg格式的图片");}
  21. else if(str=="3"){alert("图片不能大于1M");}
  22. else if(str=="4"){alert("请选择要上传的文件");}
  23. else {alert('操作失败!');}
  24. }
  25. else alert('操作失败!');
  26. },
  27. error: function (error) {alert(error);},
  28. url:'Handler.ashx', /*设置post提交到的页面*/
  29. type: "post", /*设置表单以post方法提交*/
  30. dataType: "text" /*设置返回值类型为文本*/
  31. });
  32. }
  33. </script>
  34. </head>
  35. <body>
  36. <form id="form1" runat="server">
  37. <input id="File1" name="File1" type="file" />
  38. <input id="iptUp" type="button" value="上传Logo"  onclick="upload()"/>
  39. <img id="img1" alt="网站Logo" src="data:images/weblogo.jpg" />
  40. </form>
  41. </body>
  42. </html>

二、新建一个一般处理文件Handler.ashx

    1. <%@ WebHandler Language="C#" Class="Handler" %>
    2. using System;
    3. using System.Web;
    4. public class Handler : IHttpHandler {
    5. public void ProcessRequest (HttpContext context) {
    6. HttpPostedFile _upfile = context.Request.Files["File1"];
    7. if (_upfile == null)
    8. {
    9. ResponseWriteEnd(context, "4");//请选择要上传的文件
    10. }
    11. else
    12. {
    13. string fileName = _upfile.FileName;/*获取文件名: C:\Documents and Settings\Administrator\桌面\123.jpg*/
    14. string suffix = fileName.Substring(fileName.LastIndexOf(".") + 1).ToLower();/*获取后缀名并转为小写: jpg*/
    15. int bytes = _upfile.ContentLength;//获取文件的字节大小
    16. if (suffix != "jpg")
    17. ResponseWriteEnd(context, "2"); //只能上传JPG格式图片
    18. if (bytes > 1024 * 1024)
    19. ResponseWriteEnd(context, "3"); //图片不能大于1M
    20. _upfile.SaveAs(HttpContext.Current.Server.MapPath("~/images/logo.jpg"));//保存图片
    21. ResponseWriteEnd(context, "1"); //上传成功
    22. }
    23. }
    24. private void ResponseWriteEnd(HttpContext context, string msg)
    25. {
    26. context.Response.Write(msg);
    27. context.Response.End();
    28. }
    29. public bool IsReusable {
    30. get {
    31. return false;
    32. }
    33. }
    34. }

项目结构图

ajax图片上传(asp.net +jquery+ashx)的更多相关文章

  1. 一个伪ajax图片上传代码的例子

    一个伪ajax图片上传实现代码. 复制代码代码如下: <?php  if($_FILES){  ?>  <script>  window.parent.ajaxUploadPi ...

  2. 两个由于php.ini配置错误导致的报错:ajax图片上传报错和exec报错

    遇到了两个由于php.ini配置错误导致的报错:ajax图片上传报错和exec报错 首先第一个: 在做一个用ajax图片上传的功能中,php报了这样一个错误:File upload error - u ...

  3. ajax图片上传及FastDFS入门案例.

    今天来开始写图片上传的功能, 现在的图片上传都讲求 上传完成后立刻回显且页面不刷新, 这里到底是怎么做的呢? 当然是借助于ajax了, 但是ajax又不能提交表单, 这里我们还要借助一个插件: jqu ...

  4. CKEditor不借助CKFinder实现图片上传(.net版 ashx实现)

    参考博客:http://blog.csdn.net/mydwr/article/details/8669594 本人版本:4.4.6 打开文件:ckeditor/plugins/image/dialo ...

  5. ajax图片上传功能

    一.应用场景 当用户需要上传图片当做自己的头像时,预览的时候该图片需要在本地预览,不应该通过网络从服务器上取到之后预览 二.实现方法 1.方法1: 注释:给上传文件的input标签绑定一个change ...

  6. 用Ajax图片上传、预览、修改图片

    首选图片的上传和下载并不是很难,但要注意细节. 一,给出前端图片上传的html代码 1.图片上传的控件 <img src="/${res}/images/default.png&quo ...

  7. ajax图片上传

    使用ajaxfileupload.js插件 html代码: <p> <label>ajax上传</label> <input type="file& ...

  8. ajax图片上传,单个按钮实现选择图片和上传

    //图片原件上传功能 function gosubmit(file, key) { var formData = new FormData($("#inputForm")[0]); ...

  9. 基于jQuery仿uploadify的HTML5图片上传控件jquery.html5uploader

    (function($){ var methods = { init:function(options){ return this.each(function(){ var $this = $(thi ...

随机推荐

  1. Android 如何生成jks签名文件

  2. 【BZOJ4337】树的同构(树同构,哈希)

    题意: 树是一种很常见的数据结构. 我们把N个点,N-1条边的连通无向图称为树. 若将某个点作为根,从根开始遍历,则其它的点都有一个前驱,这个树就成为有根树. 对于两个树T1和T2,如果能够把树T1T ...

  3. 记录redis 存放JSON字符串,在并发操作时读-改-写问题

    问题描述: 这里涉及到的问题其实就是普遍的读-改-写,redis可以保证每个操作的原子性,但是无法保证多个操作的原子性,解决的方法可以使用redis提供的multi和watch命令,具体使用如下:1. ...

  4. EventBus和Otto第三方构架

    代码 添加依赖:implementation 'org.greenrobot:eventbus:3.0.0'1注册并声明订阅者,然后发布事件最后解除注册 @Override protected voi ...

  5. java valueOf

    valueOf 方法可以将原生数值类型转化为对应的Number类型,java.lang.Number 基类包括ouble.Float.Byte.Short.Integer 以及 Long派生类, 也可 ...

  6. CSAR——Channel-wise and Spatial Feature Modulation Network for Single Image Super-Resolution

    1. 摘要 CNN 中的特征包含着不同类型的信息,它们对图像重建的贡献也不一样.然而,现在的大多数 CNN 模型却缺少对不同信息的辨别能力,因此也就限制了模型的表示容量. 另一方面,随着网络的加深,来 ...

  7. ConcurrentSkipListMap 源码分析

    ConcurrentSkipListMap ConcurrentSkipListMap 能解决什么问题?什么时候使用 ConcurrentSkipListMap? 1)ConcurrentSkipLi ...

  8. 阶段1 语言基础+高级_1-3-Java语言高级_03-常用API第二部分_第2节 Date类_5_练习_计算出一个人已经出生了多少天

    Alt+回车

  9. python实现建立udp通信

    实现代码如下: #udp协议通信import socket,timeclass UdpConnect: def get_udp(self,ip,port,message): #建立udp连接 myso ...

  10. Python笔记(二十八)_魔法方法_迭代器

    迭代器用于遍历容器中的数据,但它不是容器,它是一个实现了__next__方法的对象 与迭代器相关的内置函数: iter(): 将一个对象转换成一个迭代器 next(): 访问迭代器中的下一个变量,直到 ...