jQuery+ajax简单实现文件上传的方法
网络编程 2021-07-04 19:59www.168986.cn编程入门
这篇文章主要介绍了jQuery+ajax简单实现文件上传的方法,结合实例形式简单分析了jQuery基于ajax的post方法进行文件传输及asp.后台处理技巧,需要的朋友可以参考下
本文实例讲述了jQuery+ajax简单实现文件上传的方法。分享给大家供大家参考,具体如下:
可以通过ajax来提交表单,而不会刷新页面。主要使用的方法是 $("#formID").ajaxSubmit()方法。
1、要引入js插件
需要下载的附件:jquery.form.js
2、页面代码:
<script src="project/js/jquery.form.js" type="text/javascript"></script> <script src="project/js/fileload.js" type="text/javascript"></script> <script type="text/javascript"> $(document).ready(function() { createHtml($("#str")); }) </script> <tr> <td>图片</td> <td> <div id="str"> </div> <p style="display: none;" id="timgUrl"></p> <p style="color: red" id="timgok"></p> <img id="backImgUrl" src="@Model.ImageUrl" style="width:300px; height:200px;" /></td> </tr> <script src="~/project/js/jquery.form.js" type="text/javascript"></script> <script src="~/project/js/fileload.js" type="text/javascript"></script>
fileload.js:
function fileloadon() { $("#msg").html(""); $("#_fileForm").submit(function () { $("#_fileForm").ajaxSubmit({ type: "post", url: "/201410CarVideoAdmin/Home/UploadHelper", suess: function (data1) { $('#timgUrl').html(data1); var reg = new RegExp('"', "g"); var imageUrl = $('#timgUrl').text().replace(reg, ""); $('#backImgUrl').attr("src", imageUrl); if ($('#timgUrl').html() != null) { $('#timgok').html("文件上传成功"); } else { $('#timgok').html("文件上传失败"); } }, error: function (msg) { alert("文件上传失败"); } }); return false; }); $("#_fileForm").submit(); }
Controller Code:
[HttpPost] public ActionResult UploadHelper() { //开始上传 string imageUrl = string.Empty; QF.WebGamePlatform.Reference.FileUploadService service = new QF.WebGamePlatform.Reference.FileUploadService(); var fileResult = service.PicUpLoad(Request.Files[0]); if (fileResult.Code == 0) { imageUrl = fileResult.Data.RawImageUrl; } return Json(imageUrl, JsonRequestBehavior.AllowGet); }
更多关于jQuery相关内容感兴趣的读者可查看本站专题:《》、《》、《》、《》、《》、《》、《》及《》
希望本文所述对大家jQuery程序设计有所帮助。
编程语言
- 机械手焊接机器人编程 机械手焊接设备编程
- vb数据库编程实例,vb做数据库
- tiobe世界编程语言排行榜,全球编程语言排行
- 成都java编程培训 成都it编程培训中心
- 编程基础培训,编程基础知识培训
- flash游戏编程基础教程,flash游戏开发教程
- 不会英语能学编程吗 不会英语可以学程序员吗
- 爱心代码编程C语言 爱心代码编程c语言公式
- c语言编程学习入门 c语言编程快速入门
- 西门子plc编程培训 西门子plc编程培训班
- 哪里可以学编程 台州哪里可以学编程
- 少儿编程哪个好 少儿编程哪个品牌好
- 编程是什么意思,图形编程是什么意思
- c语言编程软件下载,c语言编程软件在哪下载
- java编程软件下载,java编程下载手机版
- ug编程培训学校,ug编程培训教程