jQuery Uploadify結合C#實現帶進度條的上傳

enpc 9年前發布 | 3K 次閱讀 C#

jQuery Uploadify結合C#實現帶進度條的上傳 

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


<html xmlns="http://www.w3.org/1999/xhtml"&gt;
<head id="Head1" runat="server">
    <title>Jquery Uploadify上傳帶進度條</title>
    <link href="js/jquery.uploadify-v2.1.4/uploadify.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript" src="js/jquery.uploadify-v2.1.4/jquery-1.4.2.min.js"></script>
    <script type="text/javascript" src="js/jquery.uploadify-v2.1.4/swfobject.js"></script>
    <script type="text/javascript" src="js/jquery.uploadify-v2.1.4/jquery.uploadify.v2.1.4.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $("#uploadify").uploadify({
                'uploader': 'js/jquery.uploadify-v2.1.4/uploadify.swf', //uploadify.swf文件的路徑
                'script': 'UploadHandler.ashx', //處理文件上傳的后臺腳本的路徑
                'cancelImg': 'js/jquery.uploadify-v2.1.4/cancel.png',
                'folder': 'UploadFile/<% = subpathName %>', //上傳文件夾的路徑
                'queueID': 'fileQueue', //頁面中，你想要用來作為文件隊列的元素的id
                'auto': false, //當文件被添加到隊列時，自動上傳
                'multi': true, //設置為true將允許多文件上傳
                'fileExt': '.jpg;.gif;*.png', //允許上傳的文件后綴
                'fileDesc': 'Web Image Files (.JPG, .GIF, .PNG)', //在瀏覽窗口底部的文件類型下拉菜單中顯示的文本
                'sizeLimit': 102400,  //上傳文件的大小限制，單位為字節 100k
                'onCancel': function (event, ID, fileObj, data) { //當從上傳隊列每移除一個文件時觸發一次
                    alert('The upload of ' + fileObj.name + ' has been canceled!');
                },
                'onComplete': function (event, ID, fileObj, response, data) { //每完成一次文件上傳時觸發一次
                    alert('There are ' + data.fileCount + ' files remaining in the queue.');
                },
                'onAllComplete': function (event, data) { //當上傳隊列中的所有文件都完成上傳時觸發
                    alert(data.filesUploaded + ' files uploaded successfully!');
                }
            });
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>



</div>
</form>


<div id="fileQueue"></div>
<input type="file" name="uploadify" id="uploadify" />
<p>
    <a href="javascript:$('#uploadify').uploadifyUpload()">上傳</a>|
    <a href="javascript:$('#uploadify').uploadifyClearQueue()">取消上傳</a>
</p>



</body>
</html>
 </pre> 

 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 uploadPath = HttpContext.Current.Server.MapPath(@context.Request["folder"]);

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

public bool IsReusable
{
    get
    {
        return false;
    }
}



}</pre>
 本文由用戶 enpc 自行上傳分享，僅供網友學習交流。所有權歸原作者，若您的權利被侵害，請聯系管理員。
 轉載本站原創文章，請注明出處，并保留原始鏈接、圖片水印。
 本站是一個以用戶分享為主的開源技術平臺，歡迎各類分享！