有时候我们项目中会用到上传文件这个功能，大多数的时候会在提交简历，发布文章等情况下用到，但是由于form表单提交后会刷新页面，可能会导致其余数据未填写，那么如何避免呢？下面就让我教大家如何解决把。
首先，我们先写前端页面。
选择文件后即刻上传文件
这时候我们已经可以把文件打开放置到浏览器缓存中了，接下来就需要用到ajax的事件，来完成选择文件后触发某一事件。
$(document).ready(function(){
$(“#tf”).change(function(){
if($(“#tf”).val()==”)
return ;
ajaxFile();
});
});
事件添加好后，我们就要继续在ajaxFile中来完成对文件的上传操作了。在这里给大家说下FormData()
FormData对象用以将数据编译成键值对，以便用XMLHttpRequest来发送数据。其主要用于发送表单数据，但亦可用于发送带键数据(keye->data)，而独立于表单使用。
function ajaxFile(){
var form = new FormData();
form.append(“file”,$(‘#tf’)[0].files[0]);
$.ajax({
url:”./upload.php”,
type:”post”,
data:form,
processData:false,
contentType:false,
dataType:”json”,
success:function(data){
$(“#msg”).html(data[‘msg’]);
},
error:function(e){
alert(“请求错误！！”);
}
});
}
这样我们就完成了对文件的上传请求操作，后端部分就和from表单中提取文件流数据一样即可。下面贴上前后端整体代码(解压密码：www.mochoublog.com)。