如何在不使用 FormData 的情况下在 ajax 调用中添加文件数据？答案

【问题标题】：how to add file data in ajax call without using FormData?如何在不使用 FormData 的情况下在 ajax 调用中添加文件数据？
【发布时间】：2016-12-30 07:43:58
【问题描述】：

如何在 ajax 调用中添加文件数据以及一些普通数据，即没有表单？当前我在我的 ajax 脚本中

$("body").on("click", "#next-step", function(event){
                $("#loader").show();
                event.preventDefault();               

                var file = $("#upload_logo")[0].files[0];
                $.ajax({
                    type: 'POST',
                    url: 'step-two.php',
                    data:{
                      name : "my name",  
                    },
                    file : {upload_logo : file},
                    contentType: false,
                    processData: false, 
                    success: function(response)
                    {
                        $("#loader").hide();
                        alert(response);

                    }
                })


    });

我找到了解决方案，但这不是我想要的工作方式

event.preventDefault();
                var fdata = new FormData()


                if($("#upload_logo")[0].files.length>0)
                   fdata.append("upload_logo",$("#upload_logo")[0].files[0])

                $.ajax({
                    type: 'POST',
                    url: 'step-two.php',
                    data:{fdata},

它有效，但我的问题是，如果我只想将我的文件添加到数据中，我该怎么做？而不是使用 FormData() 任何替代方法？

【问题讨论】：

使用formData()有什么问题？这是公认的文件上传方法。做其他事情就是使用旧技术。
你是对的，我想知道是否可以像我们在数据中添加普通输入字段一样添加文件字段？因为我无法在任何地方找到它，就像我在第一个代码文件中所做的那样：{upload_logo : file}，这不可能吗？
是的，为了让文件中的数据作为 POST 请求的一部分进行传输，我们需要使用 FormData。您还可以将数据与文件内容混合。数据：{名称：'我的名字'，文件内容：fdata}
所以基本上我不能在没有 FormData() 的情况下添加图像我只是想澄清一下？
Uploading files using AJAX without FormData (IE9)的可能重复

标签： javascript php jquery ajax post

【解决方案1】：

无法通过 ajax 上传文件。您可以使用 IFrame 上传文件，而无需刷新页面。您可以查看更多详细信息here

XHR2 支持通过 AJAX 上传文件。例如。通过 FormData 对象，但不幸的是它不被 all/old 支持浏览器。

FormData 支持从以下桌面浏览器版本开始。 IE 10+、Firefox 4.0+、Chrome 7+、Safari 5+、Opera 12+

更多详情，see MDN link

【讨论】：

【解决方案2】：

Use Form data 

var formData = new FormData('form id');
  $.ajax({
 type: 'post',
 async: false,
 cache: false,
 url: '',
 contentType: false,
 processData: false,
 data: formData,
 dataType: 'json',
 success: function (response) {

   }
 });

【讨论】：

我没有任何表单，我只有输入字段，我的问题是如何在不使用 FormData() 的情况下做到这一点？
但是您有一个点击处理程序，为什么不对特定点击发出请求？
这与您网页中的 html 表单无关。它只是 javascript 中的另一个对象，用于从 input type="file" 获取文件内容。
我正在这样做，我可以做到，我的简单问题是如何在没有 FormData() 的情况下添加通过文件上传的图像以在 ajax 调用中添加数据
比剩下的唯一选择是使用 iframe 看看这个link