您的位置:首页 > Web前端 > JQuery

jQuery序列化表单为JSON对象

2017-06-05 22:56 507 查看

[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>

[javascript] view plain copy

<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对象
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: