用SpringMVC和Jquery的Ajax进行异步提交表单
由于是使用Jquery，所以需要引入Jquery的js文件
在html的头部<head></head>加上
<script type="text/javascript" src="./js/jquery.min.js"></script>
具体的目录位置根据你的项目进行改变。
前端的HTML如下：【为了使代码看起来比较清楚，我将样式全部都清掉了】
<!--登陆表单--> <label>用户名</label> <input /> <label>密码</label> <input /> <button >登陆</button>
public.js【异步提交我写在这个文件里面】
$(function () {
//当登陆按钮被点击的时候，异步提交表单
$('#login-button').click(function () {
//获取到用户输入的用户名和密码
var usm = $('#username').val();
var psw = $('#password').val();
if (usm == "" || psw == "") {
alert("用户名或者密码不能为空!");
}
else {
//异步提交表单
$.ajax({
data: {"username": usm, "password": psw},
type: "POST",
url: "/login",
success: function (flag) {
//接收服务器的数据
},
error : function (flag) {
//错误处理
}
});
}
});
}); SpringMVC后台Controller:
@ResponseBody //声明响应Ajax请求
//声明请求URL，请求方式，编码方式【防止乱码】
@RequestMapping(value = "/login", method = RequestMethod.POST, produces = "text/html;charset=UTF-8;")
public String getUser(String username, String password) {
//data是JSON对象，类似于Map,可以放入键值对，传到前端
JSONObject data = new JSONObject();
System.out.println("username:"+username+","+password);
data.put("state",true);
return data.toString();
}
注：这里使用了JSONObject类，这个类的maven依赖为：
<!--JSON支持-->
<dependency>
<groupId>com.fasterxml.jackson.core</groupId>
<artifactId>jackson-databind</artifactId>
<version>2.9.2</version>
</dependency>
<dependency>
<groupId>org.json</groupId>
<artifactId>json</artifactId>
<version>20160810</version>
</dependency>
与此同时，需要在Spring-Servlet.xml中添加
<mvc:annotation-driven/>
对JSON进行支持
如有错误，请评论我进行更正。
