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的隐藏域来代替这是标签

jquery 序列化form表单的更多相关文章

  1. jquery序列化form表单使用ajax提交后处理返回的json数据

    1.返回json字符串: /** 将一个字符串输出到浏览器 */ protected void writeJson(String json) { PrintWriter pw = null; try ...

  2. jquery序列化form表单

    在开发中有时需要在js中提交form表单数据,就需要将form表单进行序列化. jquery提供的serialize方法能够实现. $("#searchForm").seriali ...

  3. jquery序列化from表单使用ajax提交返回json数据(使用struts2注解result type = json)

    1.action类引入struts2的"json-default"拦截器栈 @ParentPackage("json-default") //示例 @Paren ...

  4. 【jQuery】form表单元素序列化为json对象

    序列化form表单元素为json对象: <!Doctype html> <html xmlns=http://www.w3.org/1999/xhtml> <head&g ...

  5. select标签 禁止选择但又能通过序列化form表单传值到后台

    前言 项目开发中,我们可能会碰到这样的需求:select标签,禁止选择但又能通过序列化form表单传值到后台,但是当我们使用disabled="disabled"时发现,无法序列化 ...

  6. 基于Bootstrap+jQuery.validate Form表单验证实践

    基于Bootstrap jQuery.validate Form表单验证实践 项目结构 :     github 上源码地址:https://github.com/starzou/front-end- ...

  7. thinkphp处理jQuery EasyUI form表单问题

    jQuery EasyUI form表单不是ajax方式提交,而是在提交的时候新建一个隐藏的iframe并在iframe里面创建一个与绑定表单一样的表单,然后在iframe里面进行同步提交而不是异步提 ...

  8. jQuery控制form表单元素聚焦

      CreateTime--2017年5月28日08:57:16Author:Marydon jQuery使form表单的第一个文本框聚焦 /** * 使form表单的第一个文本框聚焦 */ func ...

  9. jQuery实现form表单基于ajax无刷新提交方法详解

    本文实例讲述了jQuery实现form表单基于ajax无刷新提交方法.分享给大家供大家参考,具体如下: 首先,新建Login.html页面: <!DOCTYPE html PUBLIC &quo ...

随机推荐

  1. 初探active mq

    mq(message queue),即消息队列,目前比较流行消息队列是active mq 和kafka.本文介绍如何简单的使用active mq. ActiveMQ官网下载地址:http://acti ...

  2. SQLServer删除数据库

    删除时提示: 网上找了一段: USE MASTER GO DECLARE @dbname SYSNAME SET @dbname = 'shujk' --这个是要删除的数据库库名 ) DECLARE ...

  3. VS类添加头文件注释

    VS2015参考: http://blog.csdn.net/qq395537505/article/details/50853546  修改两个文件,详细信息 VS2010: 找到VS的安装目录 E ...

  4. sql server 支持中文繁体和简体

    SET ANSI_PADDING ON  INSERT INTO 表 VALUES (N'中文')

  5. RabbitMQ简述

    官网教程 RabbitMQ是流行的开源消息队列系统,用erlang语言开发.RabbitMQ是AMQP(高级消息队列协议)的标准实现.支持多种客户端,如:Python.Ruby..NET.Java.J ...

  6. oracle启动流程

    1.切换为oracle用户:su - oracle,如: $su - oracle 2..启动监听器:lsnrctl status,如: [oracle@master ~]$ lsnrctl star ...

  7. luogu 4720 【模板】扩展卢卡斯

    题目大意: 求$C_n^m \mod p$,p不一定为质数 思路: 首先可以将$p$分解为$p1^{a1}*p2^{a2}*...*pk^{ak}$,对于这些部分可以使用$CRT$合并 对于每个$p_ ...

  8. Mybatis拦截器(插件实现原理)

    在mybatis的mybatis.cfg.xml中插入: <plugins> <plugin interceptor="cn.sxt.util.PageIntercepto ...

  9. nodejs--JWT 在前后端分离中的应用与实践

    nodejs--JWT 在前后端分离中的应用与实践 http://www.cnblogs.com/lidongyue/p/5269695.html

  10. Vue解决安卓4.4不兼容的问题

    1.npm安装 npm install babel-polyfillnpm install es6-promise package.json中会出现 "babel-polyfill" ...