一、serialize()方法

格式:var data = $("#formID").serialize();

功能:将表单内容序列化成一个字符串。

注意:要使用params = decodeURIComponent(data ,true)进行解码,不然中文数据会乱码。

数据示例:Name=小明&Age=22&Sex=男

后台:获取字符串后,可以到后台进行处理数据。

代码示例:

$.ajax({
url: "ServletSelect?action=ins",
type: "post",
data: $("form").serialize(),
dataType:"json",
success: function (data) {
alert(data.msg);
}
})

二、serializeArray()方法

格式:var strdata = $("#formID").serializeArray();

功能:将表单序列化成一个JSON结构的对象。数组类型。

数据示例:(3)[{name:"Name",value:"小明"},{name:"Age",value:"22"},{name:"Sex",value:"男"}] 获取数据为 data [0].name

通过JSON.stringify()方法,将json数据转成string类型,供后台接收。

转换类型:var str=  JSON.stringify(strdata );//转换成string数据

数据示例:”[{name:"Name",value:"小明"},{name:"Age",value:"22"},{name:"Sex",value:"男"}]”

代码示例:

var arry = $("表单").serializeArray();
$.ajax({
url: "/index/index",
data: { jsondata: JSON.stringify(arry) },
type:"post",
success: function () {
alert("success");
}
})

三、$.param()方法

格式:$.param(personObj)

功能:可以把json格式数据序列化成字符串形式

代码示例:

var obj={a:1,b:2}
var s=$.param(obj);

会形成a=1&b=2的形式

JS的Form表单转JSON格式的更多相关文章

  1. form表单内容JSON格式转化

    form表单提交时,对于Content-type为application/json是提交时需要转换成json格式,据说form enctype=‘application/json’这样就可以,然而在我 ...

  2. js将form表单序列化[json字符串、数组、对象]

    1.序列化为字符串 $("#Form").serialize();//name=zhangsan&sex=1&age=20   2.序列化为数组 var formD ...

  3. js Form表单转json格式,及后台接收(多种方法)

    转载:https://blog.csdn.net/qq_40138785/article/details/81533015 一.serialize()方法格式:var data = $("# ...

  4. form表单转换为Json字符串数据

    https://github.com/marioizquierdo/jquery.serializeJSON 效果图 加载使用 <script type="text/javascrip ...

  5. js验证form表单示例

    js验证form表单示例 检测测试了js表单验证,无jQuery(简单的功能有时无需jQuery版本) js代码如下:   <script type="text/javascript& ...

  6. 第十七篇 JS验证form表单

    JS验证form表单   这节课做一个实际的,项目里会遇到的东西,例如登录页面,我们输入‘用户名’和‘密码’或者‘手机号’还有‘验证码’等等,它都会做一个前端验证,比如验证码,是6位有效数字组成,那么 ...

  7. js模拟form表单提交数据, js模拟a标签点击跳转,避开使用window.open引起来的浏览器阻止问题

    js模拟form表单提交数据, js模拟a标签点击跳转,避开使用window.open引起来的浏览器阻止问题 js模拟form表单提交数据源码: /** * js模拟form表单提交 * @param ...

  8. form表单转化json对象

    利用 $.fn 可以让每一个jquery 对象都能直接使用这个方法. //form表单转化json对象$.fn.serializeObject = function () { var o = {}; ...

  9. JS 提交form表单

    源码实例一:javascript 页面加裁时自动提交表单Form表单:<form method="post" id="myform" action=&qu ...

随机推荐

  1. Parted 创建 GPT 分区

    对于磁盘的分区表 MBR与GPT区别. MBR:MBR分区表(即主引导记录)大家都很熟悉,是过去我们使用windows时常用的. 所支持的最大卷:2T,而且对分区有限制:最多4个主分区或3个主分区加一 ...

  2. 使用Typescript重构axios(九)——异常处理:基础版

    0. 系列文章 1.使用Typescript重构axios(一)--写在最前面 2.使用Typescript重构axios(二)--项目起手,跑通流程 3.使用Typescript重构axios(三) ...

  3. css3 transform做动画

    css3 transform做动画第一种用关键帧 这里就不说了 就说第二种方法用 transition属性 ps:1jquery anim不支持transform动画 但css还是支. 2 css3关 ...

  4. C#同级catch块和finally块中全都抛出异常,上一级捕获哪一个?

    C#同级catch块和finally块中全都抛出异常,上一级优先捕获finally块中的异常. 测试代码: using System; namespace test { class Program { ...

  5. 初识web API接口及Restful接口规范

    一.web API接口 什么是web API接口?: 明确了请求方式,提供对应后台所需参数,请求url链接可以得到后台的响应数据 url : 返回数据的url https://api.map.baid ...

  6. Ubuntu18.04.3 LTS初体验

    安装系统 想来虚拟机安装太慢,正好有一台旧电脑,干脆整个乌班图系统. 启动盘工具:UltraISO,老牌工具了. 上官网下载ISO镜像文件: https://cn.ubuntu.com/downloa ...

  7. 不止面试—jvm类加载面试题详解

    面试题 带着问题学习是最高效的,本次我们将尝试回答以下问题: 什么是类的加载? 哪些情况会触发类的加载? 讲一下JVM加载一个类的过程 什么时候会为变量分配内存? JVM的类加载机制是什么? 双亲委派 ...

  8. Intellij IDEA搭建JSP+Tomcat开发环境

    1.新建项目 然后填入项目名称和选择项目路径,填完点击完成. 2.添加WEB框架 别问我为什么不一开始就直接新建WEB框架,因为我也是看的别人的教程0.0 不过还遇到了一些新问题,后面会讲到 3.配置 ...

  9. django_4数据库2——表外键

    表关系: many to one many to many one to one many to one 记录是如何创建出来的?      先创建one,在在创建many,创建时加入ForeignKe ...

  10. 使用navicat操作PostPreSql创建表并设置主键自增和触发器

    使用navicat操作PostPreSql创建表并设置主键自增和触发器 1).创建递增序列 2).创建表,使用序列,设置主键递增 3)定义触发函数 自动生成时间戳函数 CREATE OR REPLAC ...