JQuery异步post上传表单数据标准化模板
短信预约 -IT技能 免费直播动态提醒
HTML代码:
<form id="form" enctype="multipart/form-data" method="post" >
<input type="file" name="file1" id="file" accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"><br>
<input type="text" name="l1" id="" value="1"><br>
<input type="number" name="l2" id="" value="2"><br>
<input type="checkbox" name="l3" id="" ><br>
<input type="submit" value="上传数据">
</form>
jquery代码:
$("#form").submit(function (e) {
e.preventDefault();//阻止表单刷新,也可以函数最后加上 return false;
var formData = new FormData($("#form")[0]);//formData对象实例化的参数必须为DOM,加上[0]jquery对象转为dom对象
$.ajax({
url:"http://0.0.0.1/api",
type:'post',
data: formData,
contentType: false,
processData: false,
//如果是跨域请求,请加上下面四行
//xhrFields: {
// withCredentials: true
//},
//crossDomain: true,
success:function(res){
console.log(res);
//根据返回的JSON格式数据判断数据传输状态,这个看后端返回的啥数据,没有标准。
// if(res.data["code"]=="succ"){
// alert('成功');
// }else if(res.data["code"]=="err"){
// alert('失败');
// }else{
// console.log(res);
// }
},
error:function(error){
console.log(error);
}
})
});
后端Flask数据处理:
@app.route('/api',methods=['GET','POST'])
def api():
# for item in request.form:
# print(item)
d1 = request.form.get("l1")
d2 = request.form.get("l2")
d3 = request.form.get("l3")
file = request.files.get('file')
print(file)
dict = {"code":"200","data":"处理完毕"}
return jsonify(dict)
到此这篇关于JQuery异步post上传表单数据标准化模板的文章就介绍到这了,更多相关JQuery异步post上传表单数据内容请搜索编程网以前的文章或继续浏览下面的相关文章希望大家以后多多支持编程网!
免责声明:
① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。
② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341