Javascript jQuery提交表单（带文件和文本），无需从当前窗口重定向

我想构建一个应用程序表单，其中on可以在

div

（不是表单元素）中附加一个图像-它只是几个输入元素。应在不重定向页面的情况下处理表格。所以我使用ajax。到目前为止一切正常。但现在我需要添加一个图像

$('#submit_application').click(function () {
//...
    $.ajax({
        url: 'submit.php',
        type: 'post',
        data: {
            'action': 'submit',
            'image': $('#image_upload').val(),
             // ..
            'someStringifiedJSON': JSON.stringify(foo)
        },
        success: function (data, status) {
            // ...
        },
        error: function (xhr, desc, err) {
            // ...
        }
    });
});

如何将文件放入php的

$\u文件

变量中？或者如何将文件传递到php以便上载？

您可以使用发送文件

您的ajax请求将是：

$.ajax({
    url: 'submit.php',
    type: 'post',
    data: fData ,
    contentType: false,
    processData: false,
    success: function (data, status) {
        // ...
    },
    error: function (xhr, desc, err) {
        // ...
    }
});

说明：

如指定。如果将

processData

设置为true，它将作为查询字符串传递。如果要发送未处理的数据，请将其设置为

false

contentType的默认值为

application/x-www-form-urlencoded；charset=UTF-8

。当您将其设置为false时，它将不适用于文件（因为它发送heder，如

多部分/表单数据；boundary=------------------------------------125911542220235

），请尝试以下操作：

$('#submit_application').click(function () {
    var formData=new FormData();
    formData.append('action','submit');
    formData.append('someStringifiedJSON', ''+JSON.stringify(foo));
    formData.append($('#image_upload').files[0]);
    $.ajax({
        url: 'submit.php',
        type: 'post',
        contentType:false,
        data: formData,
        success: function (data, status) {
            // ...
        },
        error: function (xhr, desc, err) {
            // ...
        }
    });
});

---

请确保在ajax请求中添加此

contentType:false

。

使用表单并防止使用javascript e.preventDfault（）方法提交表单是一种很好的做法，因此在禁用js的情况下也可以使用它。如果这里的答案都不是您需要的，请查看@ternalhour我已经提供了一个有效的答案。如果你没有更好的事情要做，也许可以发布你自己的工作代码。虽然我不明白这一点，因为这个问题已经得到了正确的回答。@Brettete我发布了一个有效的答案。我测试了它和所有的东西。你不是抄袭了5分钟前发布这篇文章的其他人的答案吗？问题与Omars的答案相同。@臭名昭著的pet0你看不出区别吗？我得到了这个错误：Uncaught TypeError:jquery.2.1.3.min.js中的非法调用对不起，你必须放（'contentType'：false'processData'：false）到settings object.editedYeah，这就解决了问题。完美的我将把这个标记为正确答案。但是，请您添加一些关于

contentType:false

和

processData:false

@notriouspet0的信息，可能是因为没有您的答案。

$('#submit_application').click(function () {
    var formData=new FormData();
    formData.append('action','submit');
    formData.append('someStringifiedJSON', ''+JSON.stringify(foo));
    formData.append($('#image_upload').files[0]);
    $.ajax({
        url: 'submit.php',
        type: 'post',
        contentType:false,
        data: formData,
        success: function (data, status) {
            // ...
        },
        error: function (xhr, desc, err) {
            // ...
        }
    });
});