一、建立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. vi set the tab width for python

    Put your desired settings in the ~/.vimrc file -- See below for some guidelines and best practices. ...

  2. 洛谷 P2590 BZOJ 1036 [ZJOI2008]树的统计

    Time limit 10000 ms//另外,BZOJ只算所有点的总时限,所以可能会放过一些原本会TLE的代码 Memory limit 165888 kB OS Linux SourceZJOI2 ...

  3. C# 字符串的长度问题

    string str = "aa奥奥"; 如果直接取 str.length,取的就是字符的长度,一个汉字也是一个字符,长度就是4. 一个汉字是两个字节,如果需要统计字节数,可以用下 ...

  4. httpscan 爬虫式的网段Web主机发现小工具

    httpscan是一个扫描指定网段的Web主机的小工具.和端口扫描器不一样,httpscan是以爬虫的方式进行Web主机发现,因此相对来说不容易被防火墙拦截.httpscan会返回IP http状态码 ...

  5. [CSP-S模拟测试]:简单的期望（DP）

    题目描述 从前有个变量$x$,它的初始值已给出. 你会依次执行$n$次操作,每次操作有$p\%$的概率令$x=x\times 2$,$(100−p)\%$的概率令$x=x+1$. 假设最后得到的值为$ ...

  6. 原生javascript代码懒加载

    1.先定义需要懒加载的样式: class="lazyload" 2.设置初始透明度为0.1: .lazyload{ filter: Alpha(opacity=10); -moz- ...

  7. linux gsensor驱动分析【转】

    本文转载自:http://blog.sina.com.cn/s/blog_89f592f501013sr2.html 本文以Bma250驱动为例子,详细介绍Gsensor设计的一个模板. gsenso ...

  8. COUNT(*) vs COUNT(col)

    w https://www.percona.com/blog/2007/04/10/count-vs-countcol/

  9. python-笔记（四）函数

    一.函数是什么? 函数一次来源于数学,但是编程中的[函数]的概念,与数学中的函数还是有很大的不同的,编程中的函数在英文中也有很多不同的叫法. 在Basic中叫做subroutine(子过程或子程序), ...

  10. 【LeetCode】 两数之和 twoSum

    两数之和 (简单) 题目描述 给定一个整数数组和一个目标值,找出数组中和为目标值的两个数: 你可以假设每个输入只对应一种答案,且同样的元素不能被重复利用. 例如: 给定 nums = [2,7,11, ...