@{ ViewBag.Title = "上传 - 示例"; } <!DOCTYPE html> <html> <head> <title></title> <meta /> </head> <body> <div> <fieldset> <legend>示例A - 普通表单上传文件，Request.Files获取上传文件</legend> <form action="/Error/A" method="post" enctype="multipart/form-data"> <input type="file" multiple /> <button type="submit">提交</button> </form> </fieldset> <fieldset> <legend>示例B - 普通表单上传文件，HttpPostedFileBase获取上传文件</legend> @using (Html.BeginForm("B", "Error", FormMethod.Post, new { enctype = "multipart/form-data" })) { <input type="file" multiple /> <button>提交</button> } </fieldset> <fieldset> <legend>示例C - ajax+FormData上传文件，Request.Files获取上传文件</legend> @using (Html.BeginForm("C", "Error", FormMethod.Post, new { enctype = "multipart/form-data", @id = "form_c" })) { <span>账号：</span><input type="text" value="神牛步行3" /><br /> <span>密码：</span><input type="password" value="神牛" /><br /> <span>文件：</span><input type="file" multiple /><br /> <button type="button">提交</button><br /> <span></span> } </fieldset> <fieldset> <legend>示例D - 自定义上传插件，Request.Files获取上传文件并提交表单内容</legend> @using (Html.BeginForm("D", "Error", FormMethod.Post, new { enctype = "multipart/form-data", @id = "form_d" })) { <span>账号：</span><input type="text" value="神牛步行3" /><br /> <span>密码：</span><input type="password" value="神牛" /><br /> <span>文件：</span><input type="file" multiple /><br /> <button type="button">提交</button><br /> <span></span> } </fieldset> </div> </body> </html> <script src="https://www.jb51.net/~/Scripts/jquery-1.10.2.min.js"></script> <script src="https://7xn3fx.com1.z0.glb.clouddn.com/js/PlugTool/shenniu.upfile-0.0.1.js"></script> <script> $(function () { //示例D代码 //初始化插件 var shenniu = new shenniu_UpFile({ url: "/Error/D_A", fileEleName: "filesd" }); //提交事件 $("#form_d button[type='button']").click(function () { var msg = $("#msg_d"); var btnSave = $(this); btnSave.attr("disabled", "disabled"); msg.html("上传中.."); //上传文件 shenniu.submitFun(function (data) { try { var result = JSON.parse(data); //上传成功，保存数据 if (result.Status == 1) { //增加上传成功的文件名称到表单 var hidFileNames = $("#form_d input[name='hidFileNames']"); if (hidFileNames.length <= 0) { $("#form_d").append("<input type='hidden' value='" + result.Data + "'/>"); } else { hidFileNames.val(result.Data); } //获取表单键值对，提交表单数据 var param = $("#form_d").serialize(); var action = $("#form_d").attr("action"); $.post(action, param, function (res) { msg.html(res.Status == 1 ? "保存成功<br/>" + res.Data : "保存失败"); }); } else { msg.html(result.Data); } } catch (e) { console.log(e.message); } finally { btnSave.removeAttr("disabled"); } }); }); }) </script>
文件上传的几个示例分享【推荐】(5)
内容版权声明：除非注明，否则皆为本站原创文章。