jQuery序列化表單為JSON對象
阿新 • • 發佈:2017-06-06
light views sdn his rip -m attr json attribute
[html] view plain copy
[html] view plain copy
- <form id="myform">
- <table>
- <tr>
- <td>姓名:</td>
- <td> <input type="text" name="name" /> </td>
- </tr>
- <tr>
- <td>性別:</td>
- <td>
- <input type="radio" name="sex" value="1"> 男
- <input type="radio" name="sex" value="0"> 女
- </td>
- </tr>
- <tr>
- <td>年齡:</td>
- <td>
- <select name="age">
- <option value="20">20</option>
- <option value="21">21</option>
- <option value="22">22</option>
- </select>
- </td>
- </tr>
- <tr>
- <td>愛好</td>
- <td>
- <input type="checkbox" value="basketball" name="hobby">籃球
- <input type="checkbox" value="volleyball" name="hobby">排球
- <input type="checkbox" value="football" name="hobby">足球
- <input type="checkbox" value="earth" name="hobby">地球
- </td>
- </tr>
- <tr>
- <td colspan="2">
- <input type="button" id="ajaxBtn" value="提交" />
- </td>
- </tr>
- </table>
- </form>
- <script type="text/javascript">
- $(function() {
- $("#ajaxBtn").click(function() {
- var params = $("#myform").serializeObject(); //將表單序列化為JSON對象
- console.info(params);
- })
- })
- $.fn.serializeObject = function() {
- var o = {};
- var a = this.serializeArray();
- $.each(a, function() {
- if (o[this.name]) {
- if (!o[this.name].push) {
- o[this.name] = [ o[this.name] ];
- }
- o[this.name].push(this.value || ‘‘);
- } else {
- o[this.name] = this.value || ‘‘;
- }
- });
- return o;
- }
- </script>
上述serializeObject方法是將form序列化為JSON對象
jQuery序列化表單為JSON對象