form 表单序列化 serialize
在开发中有时需要在js中提交form表单数据,就需要将form表单进行序列化。
jquery提供的serialize方法能够实现。
$("#searchForm").serialize();
但是,观察输出的信息,发现serialize()方法做的是将表单中的数据以htpp请求格式拼接成字符串。
例如以下代码:
<form id="searchForm">
<input name="id" value="123"/>
<input name="cx" value="lklj"/>
</form>
<script type="text/javascript">
console.info($("#searchForm").serialize());
</script>
输出结果是:id=123&cx=lklj
serialize确实是能够解决一般的提交数据。但是有时我们需要的是一个object对象,而不是字符串(比如jqgrid reload时设置查询条件参数,就需要object对象)。
所以就需要提供一个能将form转化为对象的方法。参考自:http://www.cnblogs.com/yeminglong/p/3799282.html
(function(window, $) {
$.fn.serializeJson = 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;
};
})(window, jQuery);
调用插件:
console.info($("#searchForm").serializeJson());
输出结果:Object {id: "123", cx: "lklj"}
form 表单序列化 serialize的更多相关文章
- jquery ajax(5)form表单序列化
form表单序列化<script type="text/javascript"> $(function(){ $("#send").click(fu ...
- form表单序列化数据之后,追加额外数据
form表单序列化数据之后追加额外数据多使用在js中,下面是追加额外数据的代码: <span style="font-size:18px;">$.param({'inv ...
- 原生js实现form表单序列化
当我们有form表单而且里面的表单元素较多时,咱们总不能一个个去获取表单元素内的值来进行拼接吧!这样会很让人蛋疼!为了方便与后台交互并且提高自己的开发效率,并且不让你蛋疼:我们一起用原生来写一个表单序 ...
- 原生JS实现表单序列化serialize()
有一个form表单,要用AJAX后台提交,原来想拼接json,但是数据多了麻烦,不灵活. 用HTML5的FormData来初始化表单 var formdata=new FormData(documen ...
- jQuery实现form表单序列化转换为json对象功能示例
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...
- js将form表单序列化[json字符串、数组、对象]
1.序列化为字符串 $("#Form").serialize();//name=zhangsan&sex=1&age=20 2.序列化为数组 var formD ...
- 将复杂form表单序列化serialize-object.js
<form class="form-horizontal" role="form" id="myform" action=" ...
- form表单序列化serialize-object.js
<form class="form-horizontal" role="form" id="myform" action=" ...
- form表单序列化后的数据转json对象
function formToJson(){ var data = $("#form").serialize(); data= decodeURIComponent(data,tr ...
随机推荐
- 理解 call, apply 的用法
callcall() 方法使用一个指定的 this 值和单独给出的一个或多个参数来调用一个函数. function list() { return Array.prototype.slice.call ...
- PHP 之pthreads多线程模块在windows下的安装
一.查看phpinfo 二.下载pthreads扩展 下载地址:http://windows.php.net/downloads/pecl/releases/pthreads/ 三.复制文件 复制ph ...
- MFC程序最小化到系统托盘及其响应函数
预备知识: Windows API函数: WINSHELLAPI BOOL WINAPI Shell_NotifyIcon( DWORD dwMessage, PNOTIFYICONDATA pnid ...
- 查询SQLServer2005中某个数据库中的表结构、索引、视图、存储过程、触发器以及自定义函数
查询SQLServer2005中某个数据库中的表结构.索引.视图.存储过程.触发器以及自定义函数 2013-03-11 09:05:06| 分类: SQL SERVER|举报|字号 订阅 ( ...
- copy on write
yl::string CBaseAutopProcessor::AddAuthorizedInfo(const yl::string & strOriginalUrl, const yl::s ...
- mySQL--找出各科最高成绩
//找出各科最高成绩create table gradeMax(id int primary key auto_increment,name varchar(20),subject varchar(2 ...
- 零基础入门学习Python(13)--元组:戴上了枷锁的列表
前言 这节课我们讨论主题是元祖:我们有个小标题戴上了枷锁的列表 我们都知道早在300多年前,孟德斯鸠在变法的时候说过,一切拥有权力的人都容易被滥用权力,这是万古不变的一条经验.但是呢,凡是拥有大权利的 ...
- 如果由你来设计 12306.cn,你会怎么设计?
作者:huangkun链接:https://www.zhihu.com/question/20017917/answer/15272038来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业 ...
- PHP:Mysqli 基础类
文章来源:http://www.cnblogs.com/hello-tl/p/7592594.html <?php /** * __construct($Mysql_config) 构造函数 $ ...
- Spider-scrapy日志处理
Scrapy生成的调试信息非常有用,但是通常太啰嗦,你可以在Scrapy项目中的setting.py中设置日志显示等级: LOG_LEVEL = 'ERROR' 日志级别 Scrapy日志有五种等级, ...