jQuery实现form表单元素序列化为json对象的方法

时间：2021-05-26

本文实例讲述了jQuery实现form表单元素序列化为json对象的方法。分享给大家供大家参考，具体如下：

这段代码序列化form表单元素为json对象：

<!Doctype html> <html xmlns=http://www.w3.org/1999/xhtml> <head> <title>jQuery扩展——form序列化到json对象</title> <meta http-equiv=Content-Type content="text/html;charset=utf-8"> <script type="text/javascript" src="jquery-1.10.2.js"></script></head><body><p id="results"><b>Results:</b> </p><form> <select name="aModel.single"> <option>Single</option> <option selected>Single2</option> </select> <br/><br/> <select name="aModel.multiple" multiple="multiple"> <option selected="selected">Multiple</option> <option>Multiple2</option> <option selected="selected">Multiple3</option> </select> <br/><br/> <input type="checkbox" name="aModel.check" value="check1"/> check1 <input type="checkbox" name="aModel.check" value="check2" checked="checked"/> check2 <br/><br/> <input type="radio" name="aModel.radio" value="radio1" checked="checked"/> radio1 <input type="radio" name="aModel.radio" value="radio2"/> radio2</form><script type="text/javascript"> var fields = $("select, :radio").serializeArray(); var o={}; jQuery.each(fields, function(i, fields){ if(o[this.name]){ //如果o[label]不是嵌套在数组中 if(!o[this.name].push){ o[this.name]=[o[this.name]]; // 将o[label]初始为嵌套数组，如o={a,[a,b,c]} } o[this.name].push(this.value || ''); // 将值插入o[label] }else{ o[this.name]=this.value || ''; // 第一次在o中插入o[label] } }); $("#results").append(JSON.stringify(o)); console.log(o); //用FireBug输出</script></body></html>

结果如下图所示：

希望本文所述对大家jQuery程序设计有所帮助。

声明：本页内容来源网络，仅供用户参考；我单位不保证亦不表示资料全面及准确无误，也不保证亦不表示这些资料为最新信息，如因任何原因，本网内容或者用户因倚赖本网内容造成任何损失或损害，我单位将不会负任何法律责任。如涉及版权问题，请提交至online#300.cn邮箱联系删除。

相关文章