jQuery表单数据收集成key/value对象
2011-07-20 17:56
537 查看
常常遇到需要$.get或者$.post一个表单数据,而各种各样的input、textarea、radio、checkbox等类型数据,如果想通过jQuery来提交,你必须一个一个的收集数据然后整理成一个JSON格式的{key:value, key:value...}数据,然后再提交到一个地址,为了解决这个郁闷的情况,我自己原创了一个JS方法,自动在提交前收集数据,而无须手动一个个地去整理,代码如下,大家可以尽情转载试用,但出问题不负责哈哈,你可以完善它:
// JavaScript Document /** * 检测数组中是否包含与指定值相同的单元 * 成功则返回值相同的第一个位置,没有相同的则返回FALSH */ Array.prototype.contain = function(_val){ if(this.length <= 0) return false; for(var i=0;i<this.length;i++) { if(this[i] == _val) return i; } return false; }; // 清空数组,并还原页面效果 Array.prototype.clear = function(){ this.splice(0, this.length); }; // 收集表单数据项目(还有个textarea中的换行问题是通过转换成<br/>解决的,大家自己完善) function formdata(_id) { var dd = new Object; var val = ''; var tag = ''; var name = ''; // 处理text、checkbox、select、textarea数据 $('#'+_id+' input[type=text],#'+_id+' input[type=hidden],#'+_id+' input[type=checkbox],#'+_id+' select,#'+_id+' textarea').each( function(){ val = $(this).val(); tag = this.tagName.toUpperCase(); if ($(this).attr('type') == 'checkbox') val = ($(this).attr('checked') ? val : ''); // 新方法(待测试) // val = val.replace(/\r/g, ''); // val = val.replace(/\n/g, ' '); // eval('dd.'+$(this).attr('name')+'="'+val+'";'); // eval('dd.'+$(this).attr('name')+'=dd.'+$(this).attr('name')+'.replace(/\\[n\\]/g, "\\n")'); // 原方法 if (tag == 'TEXTAREA') val = val.replace(/[\r\n]/g, '<br />'); name = ($(this).attr('name') == "" ? ($(this).attr('id') == "" ? "NULL" : $(this).attr('id')) : $(this).attr('name')); if(name != "NULL") eval('dd.'+name+'="'+val+'";'); } ); // 处理radio数据 var radios = new Array(); var tname = ''; var size = 0; $('#'+_id+' input[type=radio]').each( function(){ tname = $(this).attr('name'); if (radios.contain(tname) == false) radios.push(tname); } ); size = radios.length; for (var i=0; i<size; i++) { val = $('#'+_id+' input[type=radio][name='+radios[i]+'][checked]').val(); if (val == undefined) val = ''; eval('dd.'+radios[i]+'="'+val+'";'); } radios.clear(); return dd; } // 测试用途:输出所有表单数据 function allpro ( obj ) { // 用来保存所有的属性名称和值 var props = ""; // 开始遍历 for ( var p in obj ){ // 方法 if ( typeof ( obj [ p ]) == " function " ){ obj [ p ]() ; } else { props += p + " = " + obj [ p ] + " \t " ; } } alert( props ) ; }
相关文章推荐
- 将任意一个jQuery对象进行表单序列化,免除了提交请求时大量拼写表单数据的烦恼,支持键值对<name&value>格式和JSON格式。
- jQuery使用serialize(),serializeArray()方法取得表单数据+字符串和对象类型两种表单提交的方法
- jquery的使用----$.each(数组/json数据,function (int/key(变量名随意),value(值变量名) ))
- ######保存角色,add表单页面Ajax传参给action,多个集合属性,【较为复杂的页面传参(封装ajax json参数)】:注意表单数据序列化,jquery遍历,json对象转String
- Jquery之data([key],[value])【div存储数据,普通的和kv对】(十一)
- Jquery如何序列化form表单数据为JSON对象
- jquery手册学习--数据缓存--data([key],[value])--removeData([name|list])--jQuery.data(element,[key],[value])
- Jquery --- 将表单form数据序列化成json对象
- 将form表单里的数据封装成对象 json2.js的例子 jquery的serialize方法转换空格为+号的解决方法
- 根据表单的name(名字)数组,返回对应的Map对象。Map对象的key是表单的name,Map对象的value是表单的value
- jquery获取json对象的key和value
- jquery 实现表单数据转化为对象格式
- 用表单格式化插件jquery.serializejson将表单上的数据转换成JSON对象
- jQuery使用serialize(),serializeArray()方法取得表单数据+字符串和对象类型两种表单提交的方法
- jQuery序列化form表单数据为JSON对象的实现方法
- Jquery如何序列化form表单数据为JSON对象 C# ADO.NET中设置Like模糊查询的参数 从客户端出现小于等于公式符号引发检测到有潜在危险的Request.Form 值 jquery调用iframe里面的方法 Js根据Ip地址自动判断是哪个城市 【我们一起写框架】MVVM的WPF框架(三)—数据控件 设计模式之简单工厂模式(C#语言描述)
- java 后台模拟post表单请求发送key-value数据乱码
- jquery获取json对象中的key小技巧,遍历json串所有key,value
- AngularJs 表单提交数据不能以key-value 形式传到后台的解决方案
- 将指定的form表单中所有的输入项转为json数据{key:value,key:value}