上传文件——jquery,ajax,FormData

原创 2016年10月18日 11:41:51
<html xmlns="http://www.w3.org/1999/xhtml">   
<head>   
    <script type="text/javascript" src="jquery.js" charset="utf-8"></script>  
    <script type="text/javascript">
        function doUpload() {  
         var formData = new FormData($( "#uploadForm" )[0]);  
         $.ajax({  
          url: 'uploadurl' ,  
          type: 'POST',  
          data: formData,  
          async: false,  
          cache: false,  
          contentType: false,  //必需的
          processData: false,  //必需的
          success: function (returndata) { 
            alert(returndata);
          },  
          error: function (returndata) {  
            alert(returndata);  
          }  
         });  
    }       

    </script>
</head>  
<body>
<form id= "uploadForm">  
      <p >指定文件名: <input type="text" name="filename" value= ""/></p >  
      <p >上传文件: <input type="file" name="Filedata"/></ p>  
      <input type="button" value="上传" onclick="doUpload()" />  
</form>  


</body>

参考资料:
FormData
在jquery中使用formdata

JQuery Ajax使用FormData对象上传文件 图片

通过jQuery Ajax使用FormData对象上传文件FormData对象,是可以使用一系列的键值对来模拟一个完整的表单,然后使用XMLHttpRequest发送这个"表单"。在 Mozilla ...
  • xllily_11
  • xllily_11
  • 2016年08月26日 17:19
  • 15796

通过jQuery Ajax使用FormData对象上传文件

html代码
  • u013066244
  • u013066244
  • 2016年10月27日 10:55
  • 3680

通过Ajax使用FormData对象无刷新上传文件

写在前面:本文说的这个方案有浏览器兼容性问题;所有主流浏览器的较新版本已经支持这个对象了,比如Chrome 7+、Firefox 4+、IE 10+、Opera 12+、Safari 5+,对兼容性比...
  • z69183787
  • z69183787
  • 2016年09月13日 15:35
  • 4545

Ajax+FormData实现大附件上传带进度条

1.php.ini 设置大附件上传限制: 2.ajax对象.upload.onprogress事件: 3.上传附件代码: ...
  • Yeoman92
  • Yeoman92
  • 2016年11月16日 14:08
  • 893

使用html+ajax+formdata+SpringMVC实现单个文件,和多个文件上传功能

html代码确认附件 js代码 单个文件上传 function uploadFileMethodSingleFile() { var FileControll...
  • LegendaryHe
  • LegendaryHe
  • 2017年07月02日 17:45
  • 1835

通过Ajax方式上传文件,使用FormData进行Ajax请求

通过传统的form表单提交的方式上传文件: 测试通过Rest接口上传文件 指定文件名: 上传文件: 关键字1: 关键字2...
  • Inuyasha1121
  • Inuyasha1121
  • 2016年07月15日 11:36
  • 40130

通过Ajax方式上传文件,使用FormData进行Ajax请求

通过传统的form表单提交的方式上传文件: Html代码   form id= "uploadForm" action= "http://localhost:8080/cfJAX_RS/re...
  • z69183787
  • z69183787
  • 2016年09月13日 15:34
  • 2766

实现无刷新上传文件,使用FormData进行Ajax请求

通过传统的form表单提交的方式上传文件: Html代码   form id= "uploadForm" action= "http://localhost:8080/cfJA...
  • zmx729618
  • zmx729618
  • 2017年01月12日 13:13
  • 852

SpringMVC+Ajax用FormData对象上传页面的图片(文件),并且立马在页面上显示出来

页面表单: 页面图片标签和按钮: 点击上传图片 页面操作: // 点击按钮的时候选择图片 $("#button_identityA").click(fu...
  • yijingchao
  • yijingchao
  • 2016年04月11日 14:49
  • 6723

FormData对象异步上传文件

XMLHttpRequest Level 2添加了一个新的接口FormData,利用FormData对象,我们可以使用XMLHttpRequest的send()方法异步的提交数据,比起普通的ajax,...
  • kongjunchao159
  • kongjunchao159
  • 2015年10月27日 09:56
  • 506
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:上传文件——jquery,ajax,FormData
举报原因:
原因补充:

(最多只允许输入30个字)