用jquery.form ajax提交文件上传表单

时间:2022-11-22 14:51:53

今天是准备把我们学校的毕业论文系统的上传论文做完的,但过程遇到了问题,问题如下:

1.用原生的  <form action="/url" method="post">  <input type="file" name="file"></form>提交带有文件的表单到后台

用jquery.form ajax提交文件上传表单


2.后台是用的springMVC接收处理的,如下:

用jquery.form ajax提交文件上传表单


这样是能成功的提交带有文件的表单到后台并且能成功保存文件到本地服务器,但是我还想在执行完以后跳转并做其他处理,后来我就想到像以往一样用js来提交表单。

我就用了jquery的post方法调用post的接口

用jquery.form ajax提交文件上传表单


但这样并不能像普通表单一样接收到所有字段,还有一个file字段接收不了。


3.用jquery.form.js插件来提交表单

一开始我也很纳闷不晓得该怎么办了,后来上网查了下可以用jquery.form.js来异步提交表单,一看这个名字就感觉这个是比较专业的提交表单的,就试了下

用jquery.form ajax提交文件上传表单


然后发现就成功了,而且这个插件不要你自己再把参数或者序列化表单,只要在表单里面的input写好要传的参数写好,然后直接调用上传文件的接口就可以了。


最后我success的回调是对的,data = “true”但是没有进去,很奇葩,能执行用jquery.form ajax提交文件上传表单

跳转,但是页面不正常,后来发现最后一个return false也很关键,看网上说是为了阻止表单重复提交的,反正加上就对了。