程式師世界 >> 編程語言 >> .NET網頁編程 >> C# >> C#入門知識 >> uploadify+C#實例

uploadify+C#實例

編輯：C#入門知識

放到我們系統的時候有幾個地方要改下：

1:首先是uploadify.css

由於他取消的按鈕樣式的背景默認是../img/...

所以我們要改成可以根據你的需求改

.uploadify-queue-item .cancel a {
background: url('/uploadify/uploadify-cancel.png') 0 0 no-repeat;
.....
}

2:在頁面一般引用的是壓縮js

我用的是jquery.uploadify.min.js

但是裡面有一些提示是英文，那麼找到裡面的一些提示信息,改成相應的中文就行我的已經改了

下載地址在最下面的

3:然後是頁面的代碼如下

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default3.aspx.cs" Inherits="Default3" %>

<!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 href="uploadify/uploadify.css" rel="stylesheet" type="text/css" />
</head>
<body>
    <form id="form1" runat="server">
    <input id="file_upload_1" type="file" />
    <input id="ibtnSumbit" type="button" value="提交" />
    </form>
</body>
<script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
<script src="uploadify/jquery.uploadify.min.js" type="text/javascript"></script>
<script type="text/javascript">
    $(function () {
        $("#file_upload_1").uploadify({
            uploader: '/UploadHandler.ashx',//上傳文件後保存文件後台代碼地址
            swf: '/uploadify/uploadify.swf',//功能flash地址
            width: 90,//長度
            height: 20,//高度
            queueSizeLimit: 6,//限定上傳文件個數
            checkExisting: '/uploadify/check-exists.php',//檢定文件是否存在後台代碼地址
            buttonText: '點擊上傳文件',
            fileSizeLimit: '1000KB', //上傳文件的大小限制，單位為字節 100k
            auto: false, //當文件被添加到隊列時，自動上傳
            multi: true, //設置為true將允許多文件上傳
            fileTypeExts: '*.gif; *.jpg; *.png', //允許上傳的文件後綴
            fileDesc: '只能選擇格式 (.JPG, .GIF, .PNG)', //在浏覽窗口底部的文件類型下拉菜單中顯示的文本
            onQueueComplete: function () {
                alert('上傳成功');
                //上傳成功後不允許在上傳即上傳按鈕失效（按實際要求）
                $("#file_upload_1").uploadify('disable', true);
                //提交按鈕失效
                $("#ibtnSumbit").unbind("click");
            }
        });
        $("#ibtnSumbit").bind("click", function () {
            //動態調用上傳事件
            $("#file_upload_1").uploadify("upload", "*");
        });
    });
</script>
</html>

UploadHandler.ashx 代碼如下

<%@ WebHandler Language="C#" Class="UpLoader" CodeBehind="~/App_Code/UpLoader.cs" %>

~/App_Code/UpLoader.cs代碼如下

using System;
using System.Web;

/// <summary>
///UpLoader 的摘要說明
/// </summary>
public class UpLoader: IHttpHandler
{
    public void ProcessRequest(HttpContext context)
    {
        context.Response.ContentType = "text/plain";
        context.Response.Charset = "utf-8";

        HttpPostedFile file = context.Request.Files["Filedata"];
        string uploadPath = HttpContext.Current.Server.MapPath(@"/images/")+System.DateTime.Today.ToShortDateString()+"/";

        if (file != null)
        {
            if (!System.IO.Directory.Exists(uploadPath))
            {
                System.IO.Directory.CreateDirectory(uploadPath);
            }
            file.SaveAs(System.IO.Path.Combine(uploadPath, file.FileName));
            context.Response.Write("1");
        }
        else
        {
            context.Response.Write("0");
        }
    }

    public bool IsReusable
    {
        get
        {
            return false;
        }
    }

}

好了這樣就可以了代碼我現在傳進去直接運行就行