表单的序列化操作

1. 在使用ajax的时候我们可能涉及到提交表单中的多个数据,这个时候data属性中参数比较多,在这样的情况下我们可以对表单进行序列化的操作,即可以使用Jquery中的serialize()方法将表单中元素的内容列化成一个字符串,这样使用ajax提交表单数据时,就不用一一列举出每一个参数,只需将data参数设置为 $("form").serialize() 即可

2. 定义和用法:

serialize() 方法通过序列化表单值,创建 url 编码文本字符串。

您可以选择一个或多个表单元素(比如 input 及/或 文本框),或者 form 元素本身。

序列化的值可在生成 Ajax请求时用于 url 查询字符串中

语法:$(selector).serialize();

选择器selector可以是表单中的某一个或者多个元素,但是最常用的是对表单form进行序列化,把所有提交的文本内容都使用URL编码将其转化为字符串

需要注意的是表单中的所有name属性的名字要与用来接收的数据的JavaBean对象的属性要全部一样这样才可以接收到全部的数据,因为表单提交到控制器的数据是表单元素中name属性对应的属性值

还需要注意的是:只会将”成功的控件“序列化为字符串,如果不使用按钮来提交表单,则不对提交按钮的值序列化。如果要表单元素的值包含到序列字符串中,元素必须使用 name 属性

3. 在Jquery中还有一个与serialize()类似的方法--serializeArray(),该方法不是返回字符串,而是将DOM元素序列化后,返回JSON格式的数据

格式:var jsonData = $("form").serializeArray();

功能:将页面表单序列化成一个JSON结构的对象,注意不是JSON字符串。

比如,[{"name":"lihui", "age":"20"},{...}] 获取数据为 jsonData[0].name

猜你喜欢

转载自blog.csdn.net/qq_39445165/article/details/86545541