1. <form id="myform">
2. <table>
3. <tr>
4. <td>姓名:</td>
5. <td> <input type="text" name="name" /> </td>
6. </tr>
7. <tr>
8. <td>性別:</td>
9. <td>
10. <input type="radio" name="sex" value="1"> 男
11. <input type="radio" name="sex" value="0"> 女
12. </td>
13. </tr>
14. <tr>
15. <td>年齡:</td>
16. <td>
17. <select name="age">
18. <option value="20">20</option>
19. <option value="21">21</option>
20. <option value="22">22</option>
21. </select>
22. </td>
23. </tr>
24. <tr>
25. <td>愛好</td>
26. <td>
27. <input type="checkbox" value="basketball" name="hobby">籃球
28. <input type="checkbox" value="volleyball" name="hobby">排球
29. <input type="checkbox" value="football" name="hobby">足球
30. <input type="checkbox" value="earth" name="hobby">地球
31. </td>
32. </tr>
33. <tr>
34. <td colspan="2">
35. <input type="button" id="ajaxBtn" value="提交" />
36. </td>
37. </tr>
38. </table>
39. </form>

1. <script type="text/javascript">
3. $(function() {
4. $("#ajaxBtn").click(function() {
5. var params = $("#myform").serializeObject(); //將表單序列化為JSON對象
6. console.info(params);
7. })
8. })
10. $.fn.serializeObject = function() {
11. var o = {};
12. var a = this.serializeArray();
13. $.each(a, function() {
14. if (o[this.name]) {
15. if (!o[this.name].push) {
16. o[this.name] = [ o[this.name] ];
17. }
18. o[this.name].push(this.value || ‘‘);
19. } else {
20. o[this.name] = this.value || ‘‘;
21. }
22. });
23. return o;
24. }
25. </script>

上述serializeObject方法是將form序列化為JSON對象

jQuery序列化表單為JSON對象