Uploadify學習筆記

前言:這幾天作項目的須要學習了一下uploadify這個jquery插件如何使用的,我在網上也找了好的資料,他們發的都是舊的,是v2.x的,我從下載的是v3.2的,我本身在官網學習了一個這個插件的使用方法,官方默認的使用的是PHP語言,這裏的筆記我用的是C#語言寫的(參考的是網上的資料)。javascript

Uploadify下載地址:http://www.uploadify.com這裏下載的是最新版的v3.2,下載下來以後是會有不少的文件這是我下載的圖:
css

 

在這麼多文檔中咱們須要的就是uplodify.cssuploadify.swfuploadify-cancle.pngjquery-uploadify.min.js(jquery-uploadify.js中的其中一個),固然了還有就是jquery庫哦!html

我作的項目的目錄:java

這是我創建一個Default.aspx文件的內容: jquery

 <link href="css/uploadify.css" rel="stylesheet" type="text/css" />
    <script src="js/jquery-1.8.2.min.js" type="text/javascript"></script>
    <script src="js/jquery.uploadify.min.js" type="text/javascript"></script>

 

<%//引入相應的文件 %>
    <link href="css/uploadify.css" rel="stylesheet" type="text/css" />
    <script src="js/jquery-1.8.2.min.js" type="text/javascript"></script>
    <script src="js/jquery.uploadify.min.js" type="text/javascript"></script>
    <script type="text/javascript"> $(function () { $('#uploadify').uploadify({ //'debug':'false', //是否調試 //'buttonClass': 'buttonSum', //按鈕的樣式 //'buttonCursor':'hand', //按鈕的Cursor
                'fileTypeDesc': 'Web Files',             //容許文件的描述
                'fileTypeExts': '*.gif; *.jpg; *.png',  //文件的種類(必須和fileTypeDesc一塊兒使用)
                'uploader': 'UploadHandler.ashx',    //處理的後臺程序
                'swf': 'js/uploadify.swf',          //引入swf文件
                'cancelImg': 'img/uploadify-cancel.png', //退出的圖片
                'auto': 'true',                          //是否自動上傳
                'buttonText': '選擇文件',                  //按鈕的文本
                'folder': '/Uploads',                      //服務器端的路徑
                'fileSizeLimit': '0',                       //上傳文件的大小 
                'onSelect':function(file){                  //選擇完成後的回調函數 
 alert(file.name); }, 'onUploadComplete': function (file) {       //上傳完成的回調事件
                    alert('上傳成功'); } }); }); </script>

還有有就是UploadHandler.ashx的內容服務器

using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.IO; namespace UploadifyDemo { /// <summary>
    /// UploadHandler 的摘要說明 /// </summary>
    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("\\Uploads" + "\\"); if (file != null) { if (!Directory.Exists(uploadPath)) { Directory.CreateDirectory(uploadPath); } file.SaveAs(uploadPath + file.FileName); //下面這句代碼缺乏的話,上傳成功後上傳隊列的顯示不會自動消失
                context.Response.Write("1"); } else { context.Response.Write("0"); } } public bool IsReusable { get { return false; } } } }

    以上就是這個例子,本人也是初學!jquery插件

    還有我在網上找到到幾個不錯的文章能夠參考:http://www.abc3210.com/2012/js_09/jquery-uploadify.shtml 函數

                         http://www.cnblogs.com/akingyao/archive/2012/09/04/2670794.html學習

相關文章
相關標籤/搜索