1. 首页
  2. 问题
  3. 输入类型=文件不能与$ .ajax一起使用？
小编典典

输入类型=文件不能与$ .ajax一起使用？

ajax

我<s:file>在生成HTML的表单中有一个标记<input type="file">。当我通过表单提交（例如，提交按钮等）提交表单时，在操作方法中一切正常。但是，当我将代码更改为：

$.ajax({
    url: "actionClass!actionMethodA.action",
    type: "POST",
    error: function(XMLHttpRequest, textStatus, errorThrown) {
                alert('Error ' + textStatus);
                alert(errorThrown);
                alert(XMLHttpRequest.responseText);
            },
    data: $(form).serialize(),
    success: function(data) {
                ...
            }
});

在后端，该file字段始终为null。

在操作类中，文件字段的定义如下（使用setter和getter）：

private File impFileUrl;

是因为现在表单已序列化，所以无法在后端正确设置文件字段了吗？


阅读 230

收藏
2020-07-26

共1个答案

小编典典

这是因为jQuery.serialize（）仅序列化输入元素，而不序列化其中的数据。

仅“成功控件”被序列化到字符串。由于没有使用按钮提交表单，因此没有序列化提交按钮值。为了使表单元素的值包含在序列化的字符串中，该元素必须具有name属性。仅选中复选框和单选按钮（“
radio”或“ checkbox”类型的输入）中的值时，才会包括在内。 来自文件选择元素的数据未序列化。

但这并不意味着您不能使用ajax上传文件。其他功能或插件可能用于发送FormData对象。

FormData如果您设置了正确的选项，则也可以与jQuery一起使用：

var fd = new FormData(document.querySelector("form"));
fd.append("CustomField", "This is some extra data");
$.ajax({
  url: "actionClass!actionMethodA.action",
  type: "POST",
  data: fd,
  processData: false,  // tell jQuery not to process the data
  contentType: false   // tell jQuery not to set contentType
});
2020-07-26