<form id="DailyFinancial" > @*class="form-inline"*@
<div class="form-group">
<label for="FinancialType">记账类型</label>
<select class="form-control" id="FinancialType" name="FinancialType">
<option value="1">支出</option>
<option value="2">收入</option>
</select>
</div>
<div class="form-group">
<label for="FinancialType">收支类型</label> <select class="form-control" id="Type" name="Type">
<option value="10">吃饭</option>
</select>
<p class="help-block" style="color:red">收支类型->花钱和赚钱方式</p>
</div>
<div class="form-group">
<label for="Money">金额</label>
<input type="text" class="form-control" id="Money" name="Money" placeholder="人民币">
</div>
<div class="form-group">
<label for="Detail">收支明细</label>
<textarea class="form-control" rows="2" id="Detail" name="Detail"></textarea>
</div>
<div class="form-group">
<label for="PayType">支出类型</label> <select class="form-control" id="PayType" name="PayType">
<option value="0">信用卡</option>
</select>
</div>
<div class="form-group">
<label for="Remark">备注</label>
<textarea class="form-control" rows="2" id="Remark" name="Remark"></textarea>
</div>
<div class="form-group">
<label for="Remark2">备注</label>
<textarea class="form-control" rows="2" id="Remark2" name="Remark"></textarea>
</div>
</form>
 var o = {};
var arr = $("#DailyFinancial").serializeArray();// 直接序列化成对象数组,每个对象由name和value组成
$.each(arr,function (i,v) {
if (o[this.name]) {
  if (!o[this.name].push) { //判断o[this.name]的值是否为数组,true表示数组,false表示不是数组
o[this.name] = [o[this.name]]; //o[this.name]的值设置为数组
}
o[this.name].push(this.value || ''); //在数组后追加新的元素
}else {
o[this.name] = this.value || '';
}
});
console.log(o);

用 $("#DailyFinancial").serializeArray()把form表单的值序列化成对象数组;

用$.each函数遍历数组,遍历每个对象(如果存在重复的name,则他的值用数组来接受)组装成jQuery对象

浏览器打印结果如下:Object {FinancialType: "1", Type: "10", Money: "", Detail: "", PayType: "0"…}

注:!o[this.name].push ->当属性的值不是数组时,结果显示为undifined,如果是数组时,返回的结果是:function push() { [native code] },所以这个判断是为了避免form表单标签有重复name时,他们的值都可以获取的到。

form表单序列化为Jquery对象的更多相关文章

  1. jQuery form表单序列化为JSON对象!

    /* 来源于博客园http://www.cnblogs.com/nixil/archive/2010/12/08/1900745.html */ function paramString2obj(se ...

  2. jQuery表单验证以及将表单序列化为json对象小练习

    jquery表单验证(非实时验证),同时,将表单序列化为json对象提交表单. <!DOCTYPE html> <html lang="en"> <h ...

  3. 023-将表单序列化为json对象

    使用jQuery将表单序列化为json对象,其中serializeJson方法的名字任意,serializeArray()这个jQuery提供的方法.this指的就是谁调用了这个方法. $.fn.se ...

  4. form表单序列化为json格式数据

    在web开发过程中,经常遇到将form序列化不能格式的字符串提交到后台,下面就介绍怎样将form表单序列化为json字符串. 首先,是扩展的jquery序列化插件,依赖jquery.经测试,这段代码可 ...

  5. 将表单序列化为JSON对象

    将表单序列化为JSON对象的工具方法: $(function() { //工具方法,可以将指定的表单中的输入项目序列化为JSON数据 $.fn.serializeJson = function() { ...

  6. Jquery 将表单序列化为Json对象

    大家知道Jquery中有serialize方法,可以将表单序列化为一个“&”连接的字符串,但却没有提供序列化为Json的方法.不过,我们可以写一个插件实现. 我在网上看到有人用替换的方法,先用 ...

  7. 拓展jQuery的serialize(),将form表单转化为json对象

    jQuery 的 serialize() 方法经常会报 Uncaught TypeError: JSON.serializeObject is not a function 的错误, 原装的方法真的一 ...

  8. js 表单序列化为json对象

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

  9. From 表单序列化为json对象(代码片段)

    $.fn.serializeJson=function(){ var serializeObj={}; var array=this.serializeArray(); $(array).each(f ...

随机推荐

  1. ACM算法竞赛:抄课文

    题目如下: 比如现在要写一句话 Hello world 输入: n (n > 0) 比如输入的n为10,就将Hello world打印十 #include <stdio.h> #in ...

  2. listview异步加载图片并防止错位

    android listview 异步加载图片并防止错位 网上找了一张图, listview 异步加载图片之所以错位的根本原因是重用了 convertView 且有异步操作. 如果不重用 conver ...

  3. Shell script 传参数处理(默认变量)

    变量 含义 $0:shell脚本的名字: $1 位置参数 #1 $2 - $9 位置参数 #2 - #9 ${10} 位置参数 #10 "$*" :代表"$1c$2c$3 ...

  4. SpriteBuilder中粒子发射器的reset on visibility toggle选项解释

    如果选中该选择框,表示粒子发射器将删除所有已存在的粒子当它们的可见状态被代码改变的时候. 如果该选择框没有选中,则发射器将保持产生粒子但不渲染它们(意思是有但你看不到)当它们的可视状态为NO的时候. ...

  5. 知名IT公司的年度大会合集

    很多知名的IT公司都有年度大会,比如说谷歌,微软,Adobe,甲骨文,苹果等等.在这些公司的年度大会上,都会展示一些公司比较前沿的产品.看看这些大会的视频(也可以参会,但是门票可是非常贵的),对我们了 ...

  6. 新IO建立的聊天程序

    服务端: package com.net.scday3; import java.io.IOException; import java.net.InetSocketAddress; import j ...

  7. DEVICE_ATTR

    说道sysfs接口,就不得不提到函数宏 DEVICE_ATTR,原型是 #define DEVICE_ATTR(_name, _mode, _show, _store) \ struct device ...

  8. 【Linux 操作系统】阿里云服务器 操作实战 部署C语言开发环境(vim配置,gcc) 部署J2EE网站(jdk,tomcat)

    . 作者 :万境绝尘  转载请注明出处 : http://blog.csdn.net/shulianghan/article/details/18964835 . 博客总结 : 设置SecureCRT ...

  9. LeetCode之“数学”:Rectangle Area

    题目链接 题目要求: Find the total area covered by two rectilinear rectangles in a 2D plane. Each rectangle i ...

  10. 使用钩子参与到TCP拥塞事件的处理中

    TCP定义了几个拥塞事件,当这些事件发生时,我们可以通过TCP的拥塞控制算法,调用自定义的处理函数, 来做一些额外的事情的.也就是说,我们可以很简便的参与到TCP对拥塞事件的处理过程中. Author ...