框架：HTTP请求的表单提交的几种方式
其實就是三種：
1.??直接把表單的參數寫在Controller相應的方法的形參中
2.??通過HttpServletRequest接收
3.??通過一個bean來接收（JSON轉bean）就是我的項目中使用的方法
先創建一個LoginForm
然后通過getter方法獲取對象中的屬性數據
詳解
1.前臺主要代碼
[html]?view plain?copy
1.? <form>??
2.? ????????<table>??
3.? ????????????<tr>??
4.? ????????????????<td>賬號</td>??
5.? ????????????????<td>??
6.? ????????????????????<input?type="text"?name="userName">??
7.? ????????????????</td>??
8.? ????????????</tr>??
9.? ????????????<tr>??
10. ????????????????<td>密碼</td>??
11. ????????????????<td>??
12. ????????????????????<input?type="password"?name="password">??
13. ????????????????</td>??
14. ????????????</tr>??
15. ????????????<tr>??
16. ????????????????<td>?</td>??
17. ????????????????<td>??
18. ????????????????????<input?type="button"?value="提交"?οnclick="addUser()">??
19. ????????????????</td>??
20. ????????????</tr>??
21. ????????</table>??
22. ????</form>??
2. 接收方式1------直接把表單的參數寫在Controller相應的方法的形參中
? ? ??
[html]?view plain?copy
1.? @RequestMapping("/addUser1")??
2.? ????public?String?addUser1(String?userName,String?password)?{??
3.? ????????System.out.println("userName?is:"+userName);??
4.? ????????System.out.println("password?is:"+password);??
5.? ????????return?"/user/success";??
6.? ????}??
3.接收方式2-----通過HttpServletRequest接收
[html]?view plain?copy
1.? @RequestMapping("/addUser2")??
2.? ????public?String?addUser2(HttpServletRequest?request)?{??
3.? ????????String?userName?=?request.getParameter("userName");??
4.? ????????String?password?=?request.getParameter("password");??
5.? ????????System.out.println("userName?is:"+userName);??
6.? ????????System.out.println("password?is:"+password);??
7.? ????????return?"/user/success";??
8.? ????}??
4. 通過一個bean來接收
? ? ?（1）建立一個和表單參數對應的bean
[html]?view plain?copy
1.? public?class?User?{??
2.? ??????
3.? ????private?String?userName;??
4.? ??????
5.? ????private?String?password;??
6.? ??
7.? ????public?String?getUserName()?{??
8.? ????????return?userName;??
9.? ????}??
10. ??
11. ????public?void?setUserName(String?userName)?{??
12. ????????this.userName?=?userName;??
13. ????}??
14. ??
15. ????public?String?getPassword()?{??
16. ????????return?password;??
17. ????}??
18. ??
19. ????public?void?setPassword(String?password)?{??
20. ????????this.password?=?password;??
21. ????}??
22. }??
?? 2)通過這個bean來封裝接收的參數
[java]?view plain?copy
1.? @RequestMapping("/addUser3")??
2.? ????public?String?addUser3(User?user)?{??
3.? ????????System.out.println("userName?is:"+user.getUserName());??
4.? ????????System.out.println("password?is:"+user.getPassword());??
5.? ????????return?"/user/success";??
6.? ????}??
5. 通過json 數據來接收參數
?
[html]?view plain?copy
1.? <%@?page?language="java"?contentType="text/html;?charset=UTF-8"??
2.? ????pageEncoding="UTF-8"%>??
3.? <!DOCTYPE?html?PUBLIC?"-//W3C//DTD?HTML?4.01?Transitional//EN"?"http://www.w3.org/TR/html4/loose.dtd">??
4.? <html>??
5.? <head>??
6.? <meta?http-equiv="Content-Type"?content="text/html;?charset=UTF-8">??
7.? <title>Add?User</title>??
8.? ??
9.? <script?type="text/javascript"?src="${pageContext.request.contextPath}/resource/script/jquery-1.9.1.min.js"></script>??
10. <script?type="text/javascript">??
11. ????$(document).ready(function(){??
12. ????????$("#button_submit").click(function(){??
13. ????????????var?name?=?$("#userName").val();??
14. ????????????var?pass?=?$("#password").val();??
15. ??????????????
16. ??
17. ????????????var?user?=?{userName:name,password:pass};//拼裝成json格式??
18. ??????????????
19. ????????????$.ajax({??
20. ????????????????type:"POST",??
21. ????????????????url:"${pageContext.request.contextPath}/user/addUser4",??
22. ????????????????data:user,??
23. ????????????????success:function(data){??
24. ????????????????????alert("成功");??
25. ????????????????},??
26. ????????????????error:function(e)?{??
27. ????????????????????alert("出錯："+e);??
28. ????????????????}??
29. ????????????});??
30. ????????});??
31. ????});??
32. </script>??
33. ??
34. </head>??
35. <body>??
36. ????<form>??
37. ????????<table>??
38. ????????????<tr>??
39. ????????????????<td>賬號</td>??
40. ????????????????<td>??
41. ????????????????????<input?type="text"?id="userName"?name="userName">??
42. ????????????????</td>??
43. ????????????</tr>??
44. ????????????<tr>??
45. ????????????????<td>密碼</td>??
46. ????????????????<td>??
47. ????????????????????<input?type="password"?id="password"?name="password">??
48. ????????????????</td>??
49. ????????????</tr>??
50. ????????????<tr>??
51. ????????????????<td>?</td>??
52. ????????????????<td>??
53. ????????????????????<input?type="button"?id="button_submit"?value="提交">??
54. ????????????????</td>??
55. ????????????</tr>??
56. ????????</table>??
57. ????</form>??
58. </body>??
59. </html>??
?依然可以用Bean來接收json數據
[html]?view plain?copy
1.? @RequestMapping("/addUser4")??
2.? ????public?String?addUser4(User?user)?{??
3.? ????????System.out.println("userName?is:"+user.getUserName());??
4.? ????????System.out.println("password?is:"+user.getPassword());??
5.? ????????return?"/user/success";??
6.? ????}??
6、 使用jQuery的serializeArray()方法序列化表單元素
? ? ? ?如果表單元素很多，手工拼裝成Json數據很麻煩，可以使用JQuery提供的SerializeArray()方法序列化表單元素，返回Json數據結構數據。
[html]?view plain?copy
1.? <%@?page?language="java"?contentType="text/html;?charset=UTF-8"??
2.? ????pageEncoding="UTF-8"%>??
3.? <!DOCTYPE?html?PUBLIC?"-//W3C//DTD?HTML?4.01?Transitional//EN"?"http://www.w3.org/TR/html4/loose.dtd">??
4.? <html>??
5.? <head>??
6.? <meta?http-equiv="Content-Type"?content="text/html;?charset=UTF-8">??
7.? <title>Add?User</title>??
8.? ??
9.? <script?type="text/javascript"?src="${pageContext.request.contextPath}/resource/script/jquery-1.9.1.min.js"></script>??
10. <script?type="text/javascript">??
11. ????$(document).ready(function(){??
12. ????????$("#button_submit").click(function(){??
13. ??????????????
14. ????????????//序列化表單元素，返回json數據??
15. ????????????var?params?=?$("#userForm").serializeArray();??
16. ??????????????
17. ????????????//也可以把表單之外的元素按照name?value的格式存進來??
18. ????????????//params.push({name:"hello",value:"man"});??
19. ??????????????
20. ????????????$.ajax({??
21. ????????????????type:"POST",??
22. ????????????????url:"${pageContext.request.contextPath}/user/addUser5",??
23. ????????????????data:params,??
24. ????????????????success:function(data){??
25. ????????????????????alert("成功");??
26. ????????????????},??
27. ????????????????error:function(e)?{??
28. ????????????????????alert("出錯："+e);??
29. ????????????????}??
30. ????????????});??
31. ????????});??
32. ????});??
33. </script>??
34. ??
35. </head>??
36. <body>??
37. ????<form?id="userForm">??
38. ????????<table>??
39. ????????????<tr>??
40. ????????????????<td>賬號</td>??
41. ????????????????<td>??
42. ????????????????????<input?type="text"?id="userName"?name="userName">??
43. ????????????????</td>??
44. ????????????</tr>??
45. ????????????<tr>??
46. ????????????????<td>密碼</td>??
47. ????????????????<td>??
48. ????????????????????<input?type="password"?id="password"?name="password">??
49. ????????????????</td>??
50. ????????????</tr>??
51. ????????????<tr>??
52. ????????????????<td>?</td>??
53. ????????????????<td>??
54. ????????????????????<input?type="button"?id="button_submit"?value="提交">??
55. ????????????????</td>??
56. ????????????</tr>??
57. ????????</table>??
58. ????</form>??
59. </body>??
60. </html>??
依然可以使用bean來接收json數據
[java]?view plain?copy
1.? @RequestMapping("/addUser5")??
2.? ????public?String?addUser5(User?user)?{??
3.? ????????System.out.println("userName?is:"+user.getUserName());??
4.? ????????System.out.println("password?is:"+user.getPassword());??
5.? ????????return?"/user/success";??
總結
以上是生活随笔為你收集整理的框架：HTTP请求的表单提交的几种方式的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 框架：SpringMVC常用注解总结
- 下一篇： 框架：初识Mybatis