在做一个后台管理系统类似的项目中发现不能直接取得表单中的数值,于是想到先将表单数据转化为json,然后再用js从json中获取数据,那不就简单了吗?

于是我用了jquery的serializeArray()方法。当然结果转化出的数据是这样的

[
{name: 'type', value: '2'},
{name: 'm_id', value: 'shires'},
{name: 'rwflId',value:'5'}
...
]

这不是我想要的json数组,于是只需要将这个数组中的name和value去掉就可以了,就有了下面两种方法:

第一种:

var data = {};
$("form").serializeArray().map(function(x){
if (data[x.name] !== undefined) {
if (!data[x.name].push) {
data[x.name] = [data[x.name]];
}
data[x.name].push(x.value || '');
} else {
data[x.name] = x.value || '';
}
});

第二种:

$.fn.serializeObject = function(){
var o = {};
var a = this.serializeArray();
$.each(a, function() {
if (o[this.name] !== undefined) {
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;
}

其实原理都是一样的,只是遍历方式一个采用map,而一个采用each。

以上。

序列化表单数据$("form").serializeArray()的更多相关文章

  1. JQuery序列化表单serialize() 以及 serializeArray()

    都是利用form表单传递数据的 1.serialize()方法 描述:序列化表单内容为字符串,用于Ajax请求. 数据类似于这种: FirstName=Bill&LastName=Gates  ...

  2. jQuery 序列化表单数据 serialize() serializeArray()

    1.serialize()方法 格式:var data = $("form").serialize(); 功能:将表单内容序列化成一个字符串. 这样在ajax提交表单数据时,就不用 ...

  3. jquery获取表单数据方法$.serializeArray()获取不到disabled的值

    $.serializeArray()获取不到disabled的值 经实验,$.serializeArray()获取不到disabled的值,如果想要让input元素变为不可用,可以把input设为re ...

  4. 获取Form表单数据转化成JSON对象

    $.fn.serializeObject = function() { var o = {}; var a = this.serializeArray(); $.each(a, function() ...

  5. 将任意一个jQuery对象进行表单序列化,免除了提交请求时大量拼写表单数据的烦恼,支持键值对<name&value>格式和JSON格式。

    http://zhengxinlong.iteye.com/blog/848712 将任意一个jQuery对象进行表单序列化,免除了提交请求时大量拼写表单数据的烦恼,支持键值对<name& ...

  6. jquery serializeArray() 方法通过序列化表单值来创建对象数组(名称和值)。

    serializeArray() 方法序列化表单元素(类似 .serialize() 方法),返回 JSON 数据结构数据. html代码: <form> <div><i ...

  7. jQuery使用serialize(),serializeArray()方法取得表单数据+字符串和对象类型两种表单提交的方法

    原始form表单值获取方式(手动): $.ajax({ type: "POST", url: "ajax.php", data: "Name=摘取天上 ...

  8. jQuery对的表单数据序列化和校验

    jQuery对的表单数据序列化和校验 表单序列化 如果想让表单通过ajax异步提交,那么首先我们要通过js获取到每个表单中输入的值,如果表单项比较多的话,是一件很麻烦,很痛苦的事情,那么我们可以通过j ...

  9. jQuery序列化表单数据 serialize()、serializeArray()及使用

    1.serialize() 方法: serialize() 方法通过序列化表单值,创建 URL 编码文本字符串. 您可以选择一个或多个表单元素(比如 input 及/或 文本框),或者 form 元素 ...

随机推荐

  1. sn图书spider

    # -*- coding: utf-8 -*-import scrapyfrom copy import deepcopy class SnbookSpider(scrapy.Spider): nam ...

  2. cocos2d-x 特效集合

    本文转载自:http://www.cnblogs.com/linux-ios/archive/2013/04/09/3009292.html bool HelloWorld::init() { /// ...

  3. 2019-10-22-Roslyn-打包自定义的文件到-NuGet-包

    title author date CreateTime categories Roslyn 打包自定义的文件到 NuGet 包 lindexi 2019-10-22 19:45:34 +0800 2 ...

  4. Linux下安装MySQL-python

    因为安装过程不断出现错误,备份.系统:linux ubuntupython版本:Python 2.7.3mysql版本:mysql  Ver 14.14 Distrib 5.5.35, for deb ...

  5. tp3 key json 分页

    //json 强制转换为array $arr[$key]['checkpro'] = json_decode($val['checkpro'],JSON_FORCE_ARRAY);    $arr[$ ...

  6. input标签和fmt:formatDate 在jsp中同时使用引号解决办法

    input标签和fmt:formatDate 在jsp中同时使用引号解决办法 使用input标签设置默认值value并格式化fmt时间格式处理 格式化前: <input type="d ...

  7. 2018-2-13-windows-10预览版升级win10-7月29-10240.16384

    title author date CreateTime categories windows 10预览版升级win10 7月29 10240.16384 lindexi 2018-2-13 17:2 ...

  8. 从HelloWorld看Knative Serving代码实现

    摘要: Knative Serving以Kubernetes和Istio为基础,支持无服务器应用程序和函数的部署并提供服务.我们从部署一个HelloWorld示例入手来分析Knative Servin ...

  9. localStorage、sessionStorage、cookie的区别

    localStorage: 存储的内容大概20MB 不同浏览器不能共享,但是在同一浏览器的不同窗口中可以共享 永久生效,它的数据是存储的硬盘上,并不会随着页面或者浏览器的关闭而清楚,需手动清除 ses ...

  10. js用for循环模拟数组翻转

    文章地址 https://www.cnblogs.com/sandraryan/ js本身为数组提供了reverse()方法,可以翻转数组,返回一个新的数组,不影响原数组. 本例中用for循环简单模拟 ...