JQuery fileupload插件实现文件上传功能_

1、JQuery fileupload插件实现文件上传功能_ 这篇文章主要介绍了JQuery fileupload插件实现文件上传功能的相关资料,需要的伴侣可以参考下 道理相通，我简洁分享下在.net MVC下的实装。 1.制作Model类 using System; using System.Collections.Generic; using System.Linq; using System.Web; namespace RCRS.WebApp.LG.EM.Models /- / summary / Import画面用 / /summary /- public class tmp_Uploa

2、dFile / summary/summary public HttpPostedFileBase FileName get; set; 2.实装controller里的对应方法，我这个处理规律比较简单，懒得修改了，反正就这个意思 /- / summary / / /summary / returns/returns /- HttpPost public virtual ActionResult UploadFile() HttpPostedFileBase uploadedFile = Request.FilesFileName; string message = 失敗。; bool isU

3、ploaded = false; string path = ; string dateTimeNow = DateTime.Now.ToString(yyMMdd-hhmmss); string userName = User.Identity.GetUserName(); string uploadMsg = string.Empty; if (uploadedFile != null uploadedFile.ContentLength != 0) string pathForSaving = Server.MapPath(/App_Data/Uploaded/); try if (Bs

4、nssBihin.IsExcel(uploadedFile.FileName) path = System.IO.Path.Combine(pathForSaving, dateTimeNow + _ + uploadedFile.FileName); uploadedFile.SaveAs(path); isUploaded = BsnssBihin.UploadBihinChange(path, userName, ref uploadMsg); if (isUploaded) message = 胜利！ + n + uploadMsg; Logger.Info(胜利備品, + dateT

5、imeNow + , + + userName + + + path + + uploadMsg); else message = 失敗。 + n + uploadMsg; Logger.Info(失敗備品, + dateTimeNow + , + + userName + + +path + + uploadMsg); else message = 形式不正。; catch (Exception ex) message = string.Format(失敗: 0, ex.Message); Logger.Info(失敗備品: + ex.Message + dateTimeNow + , +

6、+ userName + + + path + ); return Json(new isUploaded = isUploaded, message = message , text/html); 3.页面的实装 model RCRS.WebApp.LG.EM.Models.tmp_UploadFile table align=center style=margin-bottom:200px tr td div style=width:470px input type=text id=tbx-file-path value=選択 readonly=readonly / /div /td td

7、 div style=width: 60px span class=btn btn-primary fileinput-button span選 択/span Html.TextBoxFor(m = m.FileName, new id = file-upload, type = file, accept = application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel ) /span /div /td td div style=width:60px a class=btn

8、 btn-primary href=# id=hl-start-upload/a /div /td /tr /table div id=loadingOver class=loadingOver/div div id=dvloader class=dvloader span class=label label-info style=align-content:center 処理中、少待/spanbr / br / img id=loadingGif src=./Content/img/loader.gif alt= / /div section scripts Scripts.Render(/

9、bundles/jquery) Scripts.Render(/bundles/jqueryui) Scripts.Render(/bundles/jqueryval) Scripts.Render(/bundles/common) Scripts.Render(/bundles/fileupload) script type=text/javascript var data_upload; $(document).ready(function () use strict; $(#file-upload).fileupload( url: ./Bihin/UploadFile, dataTyp

10、e: json, add: function (e, data) data_upload = data; , done: function (event, data) if (data.result.isUploaded) $(#tbx-file-path).val(選択); data_upload = ; $(#dvloader).css(display, none); $(#loadingOver).css(display, none); alert(data.result.message); , fail: function (event, data) data_upload = ; i

11、f (data.files0.error) $(#dvloader).css(display, none); $(#loadingOver).css(display, none); alert(data.files0.error); ); ); $(#hl-start-upload).on(click, function () if (data_upload) $(#dvloader).css(display, block); $(#loadingOver).css(display, block); data_upload.submit(); return false; ); $(#file-

12、upload).on(change, function () $(#tbx-file-path).val(); ); /script ，就是这个样子 还附赠了一个简易loding的实现 贴出CSS代码： .dvloader display:none; position:absolute; top:40%; left:40%; width:20%; height:20%; z-index:1001; text-align:center; font-size:1.5em; .loadingOver display:none; position:absolute; top:0; left:0; width:100%; height:100%; background-color:#f5f5f