Question

我已经有一个使用ajax将数据保存到数据库的表单。所以我有这个样本

Html代码

{{1}}

Javascrip Code

{{1}}

我确实有这个信息Jquery input.files equivalent但我不能让它作为PHP的$ _FILE传递。请给我一些组合输入类型文本和文件的示例代码，而不使用form标签和使用jquery ajax。 / p>

Answer 1

您可以使用FormData：

document.getElementById('btnSave').addEventListener('click', function() {
  var fd = new FormData();
  fd.append('product_name', document.getElementById('product_name').value);
  fd.append('product_description', document.getElementById('product_description').value);
  fd.append('product_name', document.getElementById('product_img').files[0]);

  var xhr = new XMLHttpRequest();
  xhr.open('POST', 'url_here');

  xhr.addEventListener('load', function(e) {
    console.log(xhr.responseText);
  });

  xhr.send(fd);
});

<强>更新

由于你想使用jQuery AJAX（我不知道为什么，因为它不准备使用XHR2），你可以告诉它不处理data参数，例如：

$('#btnSave').click(function() {
  p_name = $('#product_name').val();
  p_des = $('#product_description').val();
  p_image = $('#product_img').prop('files')[0];

  var data = new FormData();
  data.append('product_name', p_name);
  data.append('product_description', p_des);
  data.appned('product_img', p_image);


  $.ajax({
    url: 'url_here',
    data: data,
    processData: false,
    contentType: false,
    type: 'POST',
    success: function(response){
      console.log(response);
    }
  });
});

使用带有其他类型输入的ajax发送文件

1 个答案: