序列化的使用
Input输入框获取的是输入框的值
Radio单选框获取的是定义的value的值。Name要一样,name一样就能保证多个只能选择一个。
Checkbox多选框获取的是定义的value的值。Name要一样,获取的结果是有多个值的,最终形成一个数组。
{"username":"1812108004","password":"1232132","sex":"female","ball":["篮球","足球","羽毛球"]}
使用:
表单的序列化:
1、 使用; $("#form").serialize();进行序列化的操作。
var result = $("#form").serialize();
console.log(result);
如上图所示,序列化后会形成一串username=32323&password=123213&sex=male&ball=%E7%AF%AE%E7%90%83&ball=%E8%B6%B3%E7%90%83
等号左边的是input标签的name的值,右边是value的值。
只是获取<input>标签的值,其他的标签的值没获取,如上面的<p>标签的值没获取。
出现中文乱码
处理乱码的问题,在代码中添加decodeURIComponent方法
var result = $("#form").serialize();
result = decodeURIComponent(result, true);
console.log(result);
参考:https://www.jb51.net/article/89368.htm
2、 使用$("#form").serializeArray();
a) 参考如上图,最终会生成一个数组,但是不会乱码
3、 使用自定义的$("#form").serializeObject();序列化对象
a) 最终会生成一个对象
b) 一般会结合JSON.stringify来使用,把生成的对象转化为json字符串。
var result = JSON.stringify($("#form").serializeObject());
最终结果:
自定义的serializeObject需要先自己定义一个serializeObject方法,只需在你的js文件中添加如下代码即可。
$.fn.serializeObject = function () { var o = {}; var a = this.serializeArray(); $.each(a, function () { if (o[this.name] !== undefined) { 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; };