拓展jQuery的serialize(),将form表单转化为json对象
jQuery 的 serialize() 方法经常会报 Uncaught TypeError: JSON.serializeObject is not a function 的错误,

原装的方法真的一点都不好用,所以我在我的引用文件里面扩展了 jQuery 的方法,可以直接用
var obj = $("#form").parseForm(); 变成 json 对象,然后直接扔给后台。
搜索引擎搜索如下关键字可以查找更多资料:
jquery如何将表单内容转为json对象
法1
//扩展jquery的格式化方法
$.fn.parseForm=function(){
var serializeObj={};
var array=this.serializeArray();
var str=this.serialize();
$(array).each(function(){
if(serializeObj[this.name]){
if($.isArray(serializeObj[this.name])){
serializeObj[this.name].push(this.value);
}else{
serializeObj[this.name]=[serializeObj[this.name],this.value];
}
}else{
serializeObj[this.name]=this.value;
}
});
return serializeObj;
};
调用方法
var param = $("#insurInfoForm").parseForm();
$.ajax({
url : contextPath+'/products/policyList',
data : JSON.stringify(param),
type : 'post',
dataType : 'json',
async : false,
success : function(data) {
}
});
法2
$.fn.serializeObject = function()
{
var o = {};
var a = this.serializeArray();
$.each(a, function() {
if (o[this.name]) {
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;
};
调用方法参考上面~
使用方法(前提:使用的地方引入 jQuery):
法1:在需要格式化表单的html文件或者js文件中引入上面的方法。
法2:将如上的方法放进一个公共的js文件,然后在使用地方引入改公共的 js 文件。
参考:
https://blog.csdn.net/sychel/article/details/50068557
https://www.jb51.net/article/140685.htm
https://blog.csdn.net/lovesomnus/article/details/78026586
https://www.cnblogs.com/hyl8218/archive/2013/06/27/3159178.html
https://stackoverflow.com/questions/8900587/jquery-serializeobject-is-not-a-function-only-in-firefox
全文完
:)
原文地址:
https://www.cnblogs.com/poterliu/p/10142758.html
拓展jQuery的serialize(),将form表单转化为json对象的更多相关文章
- jQuery form表单序列化为JSON对象!
/* 来源于博客园http://www.cnblogs.com/nixil/archive/2010/12/08/1900745.html */ function paramString2obj(se ...
- jquery扩展方法(表单数据格式化为json对象)
1.jquery扩展方法(表单数据格式化为json对象) <script type="text/javascript"> // 将表单数据序列化为一个json对象,例如 ...
- jQuery表单验证以及将表单序列化为json对象小练习
jquery表单验证(非实时验证),同时,将表单序列化为json对象提交表单. <!DOCTYPE html> <html lang="en"> <h ...
- form表单序列化为json格式数据
在web开发过程中,经常遇到将form序列化不能格式的字符串提交到后台,下面就介绍怎样将form表单序列化为json字符串. 首先,是扩展的jquery序列化插件,依赖jquery.经测试,这段代码可 ...
- 023-将表单序列化为json对象
使用jQuery将表单序列化为json对象,其中serializeJson方法的名字任意,serializeArray()这个jQuery提供的方法.this指的就是谁调用了这个方法. $.fn.se ...
- 将表单序列化为JSON对象
将表单序列化为JSON对象的工具方法: $(function() { //工具方法,可以将指定的表单中的输入项目序列化为JSON数据 $.fn.serializeJson = function() { ...
- Jquery 将表单序列化为Json对象
大家知道Jquery中有serialize方法,可以将表单序列化为一个“&”连接的字符串,但却没有提供序列化为Json的方法.不过,我们可以写一个插件实现. 我在网上看到有人用替换的方法,先用 ...
- jQuery实现form表单序列化转换为json对象功能示例
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...
- Jquery如何序列化form表单数据为JSON对象 C# ADO.NET中设置Like模糊查询的参数 从客户端出现小于等于公式符号引发检测到有潜在危险的Request.Form 值 jquery调用iframe里面的方法 Js根据Ip地址自动判断是哪个城市 【我们一起写框架】MVVM的WPF框架(三)—数据控件 设计模式之简单工厂模式(C#语言描述)
jquery提供的serialize方法能够实现. $("#searchForm").serialize();但是,观察输出的信息,发现serialize()方法做的是将表单中的数 ...
随机推荐
- Oracle .NET Core
Oracle .NET Core Beta驱动已出,自己动手写EF Core Oracle https://www.cnblogs.com/yanweidie/p/9064609.html 使用.ne ...
- java课后思考题(五)
1.使用Files. walkFileTree()找出指定文件夹下所有扩展名为.txt和.java的文件. import java.io.IOException;import java.nio.fil ...
- standby checking script 3则 V1 shell 脚本
---1 #!/bin/sh export ORACLE_SID=hdbexport ORACLE_BASE=/db/hdbdg/app/product/databaseexport ORACLE_H ...
- 开发工具~nuget配置本地源
我们在本地部署了自己的nuget服务器,有时可以需要用到nuget restore命令去恢复包包,它会从下面的nuget.config里读你的配置源信息,就是在这里,我们要把内测的nuget服务器路径 ...
- Spring Boot Admin 监控中心
Spring Boot Admin 监控中心 Spring Boot Admin用来收集微服务系统的健康状态.会话数量.并发数.服务资源.延迟等度量信息 服务端 建立spring-cloud-admi ...
- 两个页面实现mui轮播图与选项卡结合
index.html页面 <!DOCTYPE html><html><head> <meta charset="utf-8"> &l ...
- Python3+Selenium3+webdriver学习笔记14(等待判断 鼠标事件 )
!/usr/bin/env python -*- coding:utf-8 -*-'''Selenium3+webdriver学习笔记14(等待判断 鼠标事件 )'''from selenium im ...
- MATLAB中容易忽略却经常遇到的小技巧总结
1 如何产生一个列向量相同的矩阵 例如,列向量x=[1;2;3],要产生矩阵A=[x,x,x],即[1,1,1;2,2,2;3,3,3]. A = repmat(x,1,n) 2 ...
- PostgreSQL数据类型
http://blog.csdn.net/neo_liu0000/article/category/797059 第六章 数据类型 6.1概述 PostgreSQL 提供了丰富的数据类型.用户可以使 ...
- ztree的CheckBox不显示问题解决办法
问题: 在使用ztree插件时需要设置 zTree 的节点上是否显示 checkbox / radio,但设置后不显示复选框/单选框,如下图所示 设置方法: var setting = { check ...