Question

我想制作一个包含图片的AJAX请求。只有图像是一种形式，需要只是图像。

var form = $('form')[0]; // You need to use standard javascript object here
var formData = new FormData(form);

var data = {
  id: id,
  title:title,
  photo:formdata
};

$.ajax({
  type: 'POST',
  enctype: 'multipart/form-data',
  url: '/my-url',
  data: JSON.stringify(data),
  processData: false,
  cache: false,
  contentType: false,
  success: function(response){
    console.log(response);
  },
  error: function(data){
    console.log("error");
    console.log(data);
  }
})

我正在使用.val();获取ID和标题，我想保留这个...，它可以正常使用ID和标题，但我不知道如何工作到将图像发送到数据库。

Answer 1

您的问题是因为您尝试将二进制文件FormData附加到随后序列化的对象上。

相反，您需要将其他数据添加到FormData对象，以便可以以相同的方式对其进行编码。试试这个：

var form = $('form')[0];
var formData = new FormData(form);

formData.append('title', title);
formData.append('id', id);

$.ajax({
  type: 'POST',
  enctype: 'multipart/form-data',
  url: '/my-url',
  data: formData,
  processData: false,
  cache: false,
  contentType: false,
  success: function(response) {
    console.log(response);
  },
  error: function(data){
    console.log("error");
    console.log(data);
  }
})

请注意，如果从id中的title元素中检索到input和form值，那么您甚至不需要append() }行，因为它们会在您向构造函数提供FormData时自动包含在form中。

另外，请确保在submit元素的form事件下运行此代码并致电preventDefault。请不要点击submit按钮。

Ajax请求图像

1 个答案: