: 使用uploadiify实现图片上传功能

来源：互联网发布：网络推广电话销售话术编辑：程序博客网时间：2024/05/21 19:45

使用uploadify插件实现图片上传功能。这是一种flash上传的形式。缺点是在ff不能正常的显示。有说与session的问题，没解决成功。

引入 jquery.uploadify.min.js插件和uploadify文件夹。可在官方文档中下载
建一个upload.aspx

Html代码 
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Upload.aspx.cs" Inherits="text" %>  
  
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
  
<html xmlns="http://www.w3.org/1999/xhtml">  
<head runat="server">  
    <title>上传</title>  
    <link type="text/css" rel="Stylesheet" href="Css/uploadify.css" />  
    <script src="Js/jquery-1.7.2.min.js" type="text/javascript"></script>  
    <script src="Js/Admin/jquery.uploadify-3.1.min.js" type="text/javascript"></script>  
    <script type="text/javascript">  
        $(document).ready(function() {  
            var href = location.href;  
            //alert(href);  
            if (href.indexOf('?') < 0) { alert("错误"); return; }  
            hrefhref = href.substring(href.indexOf('?') + 1, href.length);  
            var foldername = href.substring(href.indexOf('=') + 1, href.length);  
            var name=href.substring(0,href.indexOf('&'));  
            //alert(href);  
            $("#uploadify").uploadify({  
                height: 30,  
                swf: 'Images/AdministratorCenter/uploadify.swf',  
                uploader: 'UploadHandler.ashx?id=' + href,  
                width: 120,  
                buttonClass:'upload_button'  
                folder: 'WebImages',  
                fileTypeDesc: 'Web Images',  
                fileTypeExts: ' *.jpg;',  
                onUploadSuccess: function(file, data, response) { window.opener.document.all.uploadfile.innerHTML = foldername+"/"+name + ".jpg"; window.close(); },  
                onUploadError: function(file, errorCode, errorMsg, errorString) { alert(errorString); }  
            });  
        });    
    </script>  
</head>  
<body>  
    <form id="form1" runat="server">  
    <input type="file" name="uploadify" id="uploadify" />  
    </form>  
</body>  
</html>  

再建一个UploadHandler.ashx

C#代码 
<%@ WebHandler Language="C#" Class="UploadHandler" %>  
  
using System;  
using System.Web;  
using System.IO;  
  
public class UploadHandler : IHttpHandler {  
  
    public void ProcessRequest(HttpContext context)  
    {  
        context.Response.ContentType = "text/plain";  
        context.Response.Charset = "utf-8";  
  
        HttpPostedFile file = context.Request.Files["Filedata"];  
        string casetitle = context.Request["casetitle"];  
        string uploadPath =  
            HttpContext.Current.Server.MapPath(@context.Request["folder"]) + "\\WebImages\\"+casetitle+"\\";  
        string filenameSelt = context.Request["id"];  
        if (file == null || filenameSelt == null)  
        {  
            return;  
        }  
        string filetype = file.FileName.Substring(file.FileName.IndexOf("."));//文件后缀  
        if (file != null)  
        {  
            if (!Directory.Exists(uploadPath))  
            {  
                Directory.CreateDirectory(uploadPath);  
            }  
            file.SaveAs(uploadPath+ filenameSelt + filetype);  
              
            //下面这句代码缺少的话，上传成功后上传队列的显示不会自动消失  
            context.Response.Write("1");  
        }  
        else  
        {  
            context.Response.Write("0");  
        }  
    }  
   
    public bool IsReusable {  
        get {  
            return false;  
        }  
    }  
  
}  