ajax 利用formdata对象 实现多文件上传

Posted 心雨星空

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了ajax 利用formdata对象 实现多文件上传相关的知识，希望对你有一定的参考价值。

<!doctype html>
<html lang="zh">
<head>
  <meta charset="utf-8">
  <title>多文件上传</title>
  <script src="jquery.js"></script>
  <script>
   $(function(){
         $("#btn").click(function(){
               var formData = new FormData();
               for(var i=0; i<$(‘#file‘)[0].files.length;i++){
                   formData.append(‘file[]‘, $(‘#file‘)[0].files[i]);
               }
               $.ajax({
                  url: "test.php",
                  type: "POST",
                  processData: false,
                  contentType: false,
                  data: formData,
                  success: function(d){

                  }
               });

          });

   })

  </script>
</head>
<body>
    <form>    
     <input  type="file" multiple id="file" name="file[]" > 
     <input  type="button" id="btn" value="提交"/>
    </form>
</body>

　　

直接上代码: 

html代码

 



 
以上是关于ajax 利用formdata对象 实现多文件上传的主要内容，如果未能解决你的问题，请参考以下文章
 

 15. 利用ajax jquery 上传文件


 FormData对象实现文件Ajax上传


 Ajax--FormData实现二进制文件上传


 基于jQuery的ajax系列之用FormData实现页面无刷新上传


 面试题


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