jquery 序列化form表单

1.为什么要将form表单序列化?

ajax上传form表单的原始方式,是将form表单中所需要的键值对先获取,然后再组装成数据(两种方式:http:localhost:8080/test.do?personName=张三&sex=1  /   json的格式),这种方式有大量的form表单中的数据要获取,序列化的方式,只用调用一个方法即可获取上述两种方式的数据。

2.使用jquery序列化

<form id="test-form" action=""  >

  <input name="person.name"  value=“张三“>

       <input name="person.sex"  value="1“>

<!-- 测试被display修饰的元素是否会被序列化 -->

       <input   style="display:none;" name="person.age"  value="1“>

<!-- 测试没有name属性的元素是否会被序列化 -->

       <input    value="1“>

</form>

1.获取url带参数形式的数据

console.info($("#test-form").serialize() ) ;  //这里是使用jquery序列化的方法。

序列化之后的结果:“&person.name=张三(这里中文会被编码)&person.sex=1&person.age=1”

由此可见被display修饰的元素也会被序列化,没有name属性的input框不会被序列化,因为序列化的本质是key-value的形式

2.获取json对象

console.info($("#test-form").serializeObject());

序列化之后的结果:{"person.name":"张三","person.sex":"1","person.age"}

被display修饰的元素依然会被序列化

3.select/textarea等元素是否能被序列化?

未做测试,但是可以写input的隐藏域来代替这是标签

 

posted @ 2018-05-21 11:05  zero_and_one  阅读(6898)  评论(0编辑  收藏  举报