主流浏览器的ajax请求并不支持上传文件,jquery有个form的插件,可以使ajax请求携带文件,下载地址为:jhttp://lib.h-ui.net/jquery.form/3.51.0/jquery.form.min.js
网上说这个插件有两个主要方法:ajaxForm和ajaxSubmit
这里我只介绍我使用的ajaxForm吧,ajaxSubmit有机会再介绍
话不多说,上样例代码
<!-- HTML代码 -->
<form id="form" enctype="multipart/form-data">
<div class="form-group">
<input type="file" name="fileContent" id="fileContent" />
</div>
<div class="form-group">
<input type="text" name="userName" id="userName" />
</div>
<div>
<input type="submit" value="上传" onclick="handleImport()"/>
</div>
</form>
function handleImport () {
$('#form').ajaxForm({
url:'/api/importfile', //form提交数据的地址
type:'post', //form提交的方式(method:post/get)
dataType:"json", //服务器返回数据类型
clearForm:false, //提交成功后是否清空表单中的字段值
restForm:false, //提交成功后是否重置表单中的字段值,即恢复到页面加载时的状态
//target:target, //服务器返回的响应数据显示在元素(Id)号确定
//beforeSubmit:function(), //提交前执行的回调函数
success:function(data,statusText){//提交成功后执行的回调函数
alert('上传成功')
},
error:function(data){//提交失败后执行的回调函数
alert("网络异常");
},
timeout:6000 //设置请求时间,超过该时间后,自动退出请求,单位(毫秒)。
}).submit()
}