如何使用jQuery $.post简写方式实现文件上传？

首先明确：没法直接在现有$.post代码里添加cache: false、contentType: false、processData: false这三个参数，因为$.post是jQuery封装的简化版AJAX方法，只接受URL、数据、回调、数据类型这几个固定参数，没有开放额外配置项的入口。

不过有两种简单的替代方案，完全可以满足你的需求：

方案一：改用$.ajax（推荐，改动极小） #

$.post本质就是$.ajax的简写，直接改成完整的$.ajax写法，就能轻松添加所需配置，同时还能保留原有逻辑：

$("#my_form").submit(function(event){
    event.preventDefault(); // 阻止默认提交行为
    var post_url = $(this).attr("action");
    var form_data = new FormData(this); // 替换serialize()，用FormData处理文件

    $.ajax({
        url: post_url,
        type: 'POST',
        data: form_data,
        cache: false,
        contentType: false,
        processData: false,
        success: function(response) {
            $("#my_results").slideDown();
            $("#my_results_inner").html(response);
        }
    });
});

方案二：全局配置$.ajaxSetup（不推荐，谨慎使用） #

如果非要坚持用$.post，可以通过$.ajaxSetup全局设置AJAX参数，但要注意这会影响所有jQuery发起的AJAX请求，可能引发意外问题：

// 全局配置AJAX参数，所有jQuery AJAX请求都会继承这些设置
$.ajaxSetup({
    cache: false,
    contentType: false,
    processData: false
});

$("#my_form").submit(function(event){
    event.preventDefault();
    var post_url = $(this).attr("action");
    var form_data = new FormData(this); // 必须用FormData，不能用serialize()

    $.post(post_url, form_data, function(response) {
        $("#my_results").slideDown();
        $("#my_results_inner").html(response);
    });
});

关键注意点 #

• 无论用哪种方案，都必须把serialize()换成new FormData(this)，因为serialize()只会序列化文本表单字段，无法处理文件上传。
• 确保你的表单已经设置了enctype="multipart/form-data"属性，这是文件上传的必要条件。

内容的提问来源于stack exchange，提问作者osuddeth