• ajax图片上传(asp.net +jquery+ashx)


    一、建立Default.aspx页面

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


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

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


     

    项目结构图

     

  • 相关阅读:
    Object doesn't support property or method 'flat'
    yapi的部署
    mongoDB 安装
    排序
    直播原理
    文件怎么都删不掉,压缩,命令行都不行
    computed和watch
    docker安装
    跨域问题的解决方案
    一次普通的http请求
  • 原文地址:https://www.cnblogs.com/ajunForNet/p/3746927.html
Copyright © 2020-2023  润新知