PHP AJAX JQuery附件邮件

Question

只是在寻求一些建议。我在我的网站上有一个小表单，我正在构建:

<
• 名称/gh>
• 简历(附件)

我以前做过表格，但是有了附加的附件，我不确定如何去做。

我习惯使用jQuery的序列化函数。是否有类似的东西，我可以使用张贴在我的Ajax调用?

Answer 1

对于AJAX请求，您不能真正使用.serialize()函数。你需要使用FormData()。你也可以设置进度条。我们需要先检查支持:

function supportAjaxUploadWithProgress() {
  return supportFileAPI() && supportAjaxUploadProgressEvents() && supportFormData();
  function supportFileAPI() {
    var fi = document.createElement('INPUT');
    fi.type = 'file';
    return 'files' in fi;
  };
  function supportAjaxUploadProgressEvents() {
    var xhr = new XMLHttpRequest();
    return !! (xhr && ('upload' in xhr) && ('onprogress' in xhr.upload));
  };
  function supportFormData() {
    return !! window.FormData;
  }
}

下一步是使用AJAX提交表单:

var form = document.getElementById('form-id');
var formData = new FormData(form);

你必须有这些HTML:

var form = document.getElementById('the-form');
form.onsubmit = function() {
  var formData = new FormData(form);
  formData.append('file', file);
  var xhr = new XMLHttpRequest();
  // Add any event handlers here...
  xhr.open('POST', form.getAttribute('action'), true);
  xhr.send(formData);
  return false; // To avoid actual submission of the form
}

<form id="the-form" action="/upload/path" enctype="multipart/form-data">
  <input name="file" type="file">
  <input type="submit" value="Upload" />
</form>

更多信息:非常简单的Ajax上传与FormData.