在做一个后台管理系统类似的项目中发现不能直接取得表单中的数值,于是想到先将表单数据转化为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. Vue组件跨层级通信

    正常组件间通信 父->子组件 是通过属性传递 子->父组件 是通过this.$emit()传递 this.$emit()返回的是this,如果需要一些值 可使用callback方式传递 p ...

  2. 前端基础☞CSS

    css的四种引入方式 1.行内式 行内式是在标记的style属性中设定CSS样式.这种方式没有体现出CSS的优势,不推荐使用. <p style="background-color: ...

  3. 《C语言深度解剖》学习笔记之关键字

    第一章 关键字 C语言共有32个关键字. 关键字   auto 声明自动变量 int 声明整型变量 long 声明长整型变量 char 声明字符型变量 float 声明浮点型变量 short 声明短整 ...

  4. mysql 中 DATE_ADD函数和 DATE_SUB函数用法

    mysql 中 DATE_ADD(date,INTERVAL expr type) 和 DATE_SUB(date,INTERVAL expr type) 这些函数执行日期运算. date 是一个 D ...

  5. @雅礼集训01/06 - T3@ math

    目录 @description@ @solution@ @accepted code@ @details@ @description@ 给出 n, m, x,你需要求出下列式子的值: \[\sum_{ ...

  6. H3C TCP/UDP端口号

  7. CODE FESTIVAL 2017 qual A B fLIP(补题)

    平时没见过这样的题目,看到后很懵逼.没想到. 思路:按下按钮的顺序并不影响结果,一个按钮要么按一次,要么不按,按多了也没用,比如:按3次和按1次没啥区别. 假设这是个M * N的矩阵,我们已经按下了k ...

  8. HTML静态网页--框架

    框架: 1.frameset frameset最外层的去掉body,直接用frameset 在超级链接指定目标页面显示在哪个框架窗口中 第一步:给要显示内容的目标frame设置name属性 第二步:给 ...

  9. HDU 1026 BSF+优先队列+记录路径、

    #include<iostream> #include<cmath> #include<cstring> #include<cstdio> #inclu ...

  10. JS正则验证两位小数,验证数字最简单正则表达式大全

    <h3>输入完按回车后即可验证!</h3> 正整数: <input type="text" size="20" onkeydown ...