点击button以后,表单先由ajax提交,然后无论后台返回什么结果,页面都会跳转到表单action属性指定的路劲,
也就是login.html
使用的是html、jquery、javascript,后台是spring mvc 代码如下:
html表单:
1
2
3
4
5
6
7
8
9
|
< form action = "login.html" method = "post" id = "loginForm" > < input type = "text" id = "username" name = "userName" /> < input type = "password" id = "password" name = "password" /> < button class = "btn btn-warning btn-loginsize" onClick = "submitForm()" > 登陆 </ button > < a href = "#" >忘记密码?</ a > < a href = "#" >注册</ a > </ form > |
jquery、javascript代码:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
|
<script> function submitForm() { $.ajax({ cache: true , type: "POST" , url: "verification.json" , dataType: "json" , data:$( "#loginForm" ).serializeArray(), async: false , success: function (data){ if (data.flag == "1" ) { //登陆成功 alert( "aa" ); //这里返回正确 location.href= "index.html" ; //这里没有作用,什么原因? } else { //登陆失败 alert( "warnings" ); } }, error: function (data){ alert( "error" ); } }); } </script> |
后台代码
1
2
3
4
5
6
7
8
9
10
11
12
|
@RequestMapping ( "/verification.json" ) @ResponseBody public Map<String, Object> verification(User user) { Map<String, Object> map = new HashMap<String, Object>(); if (user.getUserName().equals( "admin" ) && user.getPassword().equals( "admin" )) { map.put( "flag" , "1" ); } else { map.put( "flag" , "0" ); } return map; } |