php ajax input files,3步实现ajax传递input的file参数(表单上传和ajax文件异步上传)

在做项目的过程中遇到要将form表单提交转为ajax方式提交，但是表单中的file参数无法通过传统的ajax方式传递，下面就主要的ajax上传写出示例！注意： context.Request.Files不适合对大文件进行操作，下面列举的主要对于小文件上传的处理！

1、将form元素的属性action、enctype、method去掉，添加id="form"，form元素就变为

3、引入 jquery.form.js，右键选择“另存为”

4、提交按钮增加 οnclick="add_ajax()" 并把 type="submit" 修改为 type="button"

例如：

5、把ajax代码放在页面最底部(注意不能放在jquery库之前)

姓名

头像

accept="image/png,image/jpeg"的意思是只能选择png和jpg后缀的图片，也可以使用accept="image/*"来设定全部类型的图片。

function add_ajax() {

document.getElementById("form").encoding = "multipart/form-data".enctype = "multipart/form-data";

var option = {

url: "ajax.php",//提交到后台文件

type: "post",

success: function(data) {

alert(data);//弹窗显示PHP返回的值

$("#deok").html(data);//以html的形式显示在指定id的元素里

$('#form')[0].reset();//提交后清除表单填写的值

$(this).val("");//清空上次input框里的数据

$("#deok").val(aaa["boxnum"]);//向input框里写入新数据

}

};

$("#form").ajaxSubmit(option);

return false;

}

延伸阅读：

当表单的属性设置为"disabled"时，提交表单时，select的值无法传递，需要提交前移除disabled属性，使用$("#role").removeAttr("disabled");即可(提交前移除id="role"的disabled属性)