问题描述

一般的form表单提交是单向的：只能给服务器发送数据，但是无法获取服务器返回的数据，也就是无法读取HTTP应答包。

想要真正的半双工通讯一般需要使用Ajax, 但是Ajax对文件传输也很麻烦。

解决方法

方法一：

jQuery封装了一个form表单提交有回调功能的方法

导入

jquery

jquery-form.js

如下: 一个上传文件的form

请选择头像:

js实现

// $(function ())是文档document加载完自动调用的函数

$(function () {

/*

获取form元素，调用其ajaxForm(...)方法

内部的function(data)的data就是后台返回的数据

*/

$("#form1").ajaxForm(function (data) {

console.log(data);

console.log("str:" + JSON.stringify(data));

}

);

});

请求的url在form的action中定义，获取到的后台数据是JSON格式$(function ())不套在外面，里面的这个请求函数没法自启动后台代码无差异

方法二：

使用ajax来发送请求提交表单

前端页面：

ajax请求发送数据

$("#saveUserInfo").click(function() {

var formObject = {};

var formArray =$("#userInfo").serializeArray();

$.each(formArray,function(i,item){

formObject[item.name] = item.value;

});

$.ajax({

url:"user/addUser",

type:"post",

contentType: "application/json; charset=utf-8",

data: JSON.stringify(formObject),

dataType: "json",

success:function(data){

alert(data.msg);

},

error:function(e){

alert("错误！！");

}

});

});

注意

如果仅仅粗糙的使用ajax的话，那就是 $("#submit").ajax(…),　很显然里面的发给后台的数据data很难传输文件。最初，ajax出于安全性考虑，不能对文件进行操作，所以就不能通过ajax来实现文件上传。

参考

通过form表单上传文件获取后台传来的数据

小伙伴是不是遇到过这样的问题,通过submit提交form表单的时候,不知怎么获取后台传来的返回值.有的小伙伴就会说你不会发送ajax,其实也会.假如提交的form表单中含有文件,怎么办? 步骤1:想 ...

javascprit form表单提交前验证以及ajax返回json

1.今天要做一个手机验证码验证的功能.需求是前端页面点击发送 短信验证码,后台接收后通过ajax返回到前端,之后前端在提交时候进行验证.思路很简单,不过做的过程还是学到不少的东西. 1.ajax请求后 ...

前后端交互技术之servlet与form表单提交请求及ajax提交请求

1.先来个简单的form表单 login.jsp,建在webcontent目录下(url写相对路径就可以了)

...

Jobs(三) HTML的form表单提交中文后，后台取出乱码的问题

解决form表单中提取的中文在后台乱码的问题有两种情况: form表单以GET方式提交: form表单以POST方式提交 一. 解决以GET方式提交的中文乱码问题,可以更改Tomcat服务器的配置文件 ...

thinkPHP form表单提交参数无法获取

后台打印获取的数据为empty, 找了半天,是因为 input标签没有写name, 真是醉了!记一下,免得以后再犯错了.

24.form表单提交的六种方式

form表单提交方式 1.无刷新页面提交表单 表单可实现无刷新页面提交,无需页面跳转,如下,通过一个隐藏的iframe实现,form表单的target设置为iframe的name名称,form提交目标 ...

Form表单提交，Ajax请求，$http请求的区别

做过前端同学想必都避免不了要和后台server打交道.而以下这三种与后台交互的方式想必大家都不陌生. Form表单提交,Ajax请求,Angular的$http请求 以前一直搞不清楚什么时候应该用哪种 ...

form表单提交，后台怎么获取select的值？后台直接获取即可，和input方式一样。

form表单提交,后台怎么获取select的值? 后台直接获取即可,和后台获取input的值方式一样. form提交后,后台直接根据select的name获取即可,即getPara("XXX ...

随机推荐

ubuntu中搭建php7+mongodb方法

首先照着这篇文章操作 http://blog.csdn.net/Toshiya14/article/details/51417076 结果发现一直报Cannot find OpenSSL's libr ...

centos7配置wordpress

1.安装Apache和mariadb yum -y install httpdyum -y install mariadb-server mariadb 2.设置开机启动 systemctl enab ...

js的一些冷门的用法

1.delete 2.void 0 3.>>> 4.>>0 字符串转为数字 5.[] == ![] 6.

mysql中出现的Data truncated for column

mysql中想一个数据库中插入一条记录时,有可能因为好多原因,会出现Data truncated for column XXXXX的错误,这是因为你的数据类型的长度不一致导致的,仔细查看一下数据类型的 ...

Ubuntu下Django初体验(二)——创建工程及应用

一.工程目录详解 创建工程后得到如下目录: 1. manage.py 管理项目.创建数据库.启动服务器等.测试等. 查看子命令: python manage.py 启动服务器: python mana ...

C#Excel导出导入

using System; using System.Collections.Generic; using NPOI; using NPOI.HPSF; using NPOI.HSSF; using ...

Java中的包含义

JAVA提供了强大的应用程序接口,既JAVA类库.他包含大量已经设计好的工具类,帮助程序员进行字符串处理.绘图.数学计算和网络应用等方面的工作.下面简单介绍JAVA核心类库中常用的组建包. 1.jav ...

C4 垃圾回收

使用C4垃圾回收器可以有效提升对低延迟有要求的企业级Java应用程序的伸缩性. 到目前为止,stop-the-world式的垃圾回收视为影响Java应用程序伸缩性的一大障碍,而伸缩性又是现代企业级Ja ...

侯捷STL课程及源码剖析学习2: allocator

以STL 的运用角度而言,空间配置器是最不需要介绍的东西,它总是隐藏在一切组件(更具体地说是指容器,container)的背后,默默工作默默付出. 一.分配器测试 测试代码 #include < ...

swift4&period;2 - 一个自定义view弹框

import UIKit /* * 注册协议view:没找到 UI原图,咱不实现 */ class JYRegisterProtocolView: UIView { /// 点击同意协议的回调 pri ...