没有提交按钮的 FormData答案

【问题标题】：FormData without submit button没有提交按钮的 FormData
【发布时间】：2016-04-20 04:27:41
【问题描述】：

您好，我有他的上传文件表格

$("#form").on('submit',(function(e) {
        e .preventDefault();
        $.ajax({
            url: "index2.php",
            type: "POST",
            data:  new FormData(this),
            contentType: false,
            cache: false,
            ...

在 HTML 格式中：

 <form id="form" action="index2.php" method="post" enctype="multipart/form-data">
  <input id="uploadImage" type="file" accept="image/*" name="image" /><br/>
  <input id="button" type="submit" value="Upload">
 </form>

它有效。但现在我想要删除按钮。我想在选择文件时自动上传。

          $.ajax({
                url: "index2.php",
                type: "POST",
                data:  new FormData("#form"),
                contentType: false,

                 ...

但不起作用。可以帮我做吗？

【问题讨论】：

您需要等到文件完成上传。有什么尝试？
好的，我不想提交然后开始上传，我想从本地主机选择文件时，立即开始上传文件

标签： javascript jquery forms form-data

【解决方案1】：

您可以添加拖放区（只需拖放）。看看自动上传：真。

$('.fileupload').fileupload({
  dataType: 'json',
  url: "/somewhere.com/here",
  dropZone: $("#picturezone"),
  autoUpload: true,
  done: function (e, data) {
   $("#pic").attr("src", URl + data.result.name + "?" + d.gettime());
 }
 }).on('fileuploadprogressall', function (e, data) {
  //Do something while it is uploading.
 });

【讨论】：

谢谢，dropzone.js 大约 64 kb，为什么我可以用更少的 5 kb 编码来使用它？
我更喜欢它。我通常可以在区域上显示生成的上传。但这一切都取决于你。

【解决方案2】：

您只需要监听该输入的 onChange 事件。

你的代码应该是这样的：

$('#uploadImage').on('change',function(){
    $.ajax({
            url: "index2.php",
            type: "POST",
            data:  new FormData("#form"),
            contentType: false,

             ...
    });
});

【讨论】：

FormData 构造函数不将 CSS 选择器字符串作为参数。您需要new FormData($("#form")[0]) 才能获取实际元素。