WebUploader官方例子看的不是很清楚,自己也是費了點勁自己寫了一下。
需求:一個單頁需要多個實例來上傳,一次可上傳多張
條件:后台接收C#
首先:引入webuploader webuploader.css webuploader.js
html:<div class="filePicker">上傳</div> Jquery:$(function(){ uploader = WebUploader.create({ auto: true, swf: '/Swf/Uploader.swf', server: '',//后台接收圖片的url (我用的是C#) fileVal: 'upload', pick: '.filePicker',//html class resize: false, duplicate: true,//可以重復上傳 但是篩選不了重復圖片 }); uploader.on('uploadSuccess', function (file, data) { var uploaderId = '#rt_' + file.source.ruid;//每個實例的唯一ID (自己寫的時候這是個突破口,時間主要花在這個上面了.... 下面可以通過這個自由發揮了) 自由發揮空間 }); uploader.on('uploadError', function (file) { var $li = $('#' + file.id), $error = $li.find('div.error'); if (!$error.length) { $error = $('<div class="error"></div>').appendTo($li); } $error.text('上傳失敗!!!'); }); });
后台接收文件代碼:C#
{//上傳資料 ResultModelData result = new ResultModelData(); string fileName = string.Empty; string savePath = string.Empty; var fileSize = 0; if (HttpContext.Current.Request.Files.Count > 0) { using (System.IO.Stream s = HttpContext.Current.Request.Files[0].InputStream) { fileSize = HttpContext.Current.Request.Files[0].ContentLength; fileName = HttpContext.Current.Request.Files[0].FileName; if (Bas_FileBLL.UploadAudit(s, fileName, out savePath)) { result.Code = 1; result.Message = TipCodeType.TipCode.操作成功.ToString(); result.Data = new { size = fileSize, fileName = fileName, path = savePath }; return result; } result.Code = -1; result.Message = "上傳失敗"; return result; } } result.Code = -1; result.Message = "文件為空"; return result; }