您好,欢迎访问一九零五行业门户网

基于JavaScript将表单序列化类型的数据转化成对象的处理(允许对象中包含对象)_javascript技巧

表单序列化类型的数据是指url传递的数据的格式,形如key=value&key=value&key=value这样的key/value的键值对。一般来说使用jquery的$.fn.serialize函数能达到这样的效果。如何将这样的格式转化为对象?
我们知道使用jquery的$.fn.serializearray函数得到的是一个如下结构的对象
[ { name: starttime value: 2015-12-02 00:00:00 }, { name: endtime value: 2015-12-25 23:59:59 }]
这是一个对象数组,但有时候我们希望得到的是如下结构的对象
{ starttime: 2015-12-02 00:00:00 endtime: 2015-12-25 23:59:59}
所以这里需要一个转化函数。
处理步骤如下:
1.使用&分隔将每一个键值对分开然后循环处理每一个键值对
var properties = serializedparams.split(&); for (var i = 0; i < properties.length; i++) { //处理每一个键值对 evalthem(properties[i]); };
2.从=符号切分指定的键值对,并对每个键和值使用decodeuricomponent解析uri 组件编码(因为url传递的序列化数据一般都是经过uri组件编码的)
var strary = new array(); strary = str.split(=); //使用decodeuricomponent解析uri 组件编码 for(var i = 0; i 2){ for(var i = 2;i 这里面有一个处理,就是值没有的时候就不会往最终对象里面添加。这个可以根据自己的情况选择删除这段代码与否
if(!attributevalue){ return ; }
4.如果键是“obj.obj.obj”这种由.符号链接的,需要将它作为对象包含对象来处理。处理的方法是将键通过.分解,然后去查看临时对象obj中是否已经包含分解出来的对象,如果是则将数据附加到已有的对象上。源码如下
var attrinames = attributename.split(.), curobj = obj; for(var i = 0; i < (attrinames.length - 1); i++){ curobj[attrinames[i]]?:(curobj[attrinames[i]] = {}); curobj = curobj[attrinames[i]]; } curobj[attrinames[i]] = attributevalue.trim();
这里面我们看到网上有对赋值部分是这么处理的
eval(obj.+attributename+=\+attributevalue.trim()+\;);
这个很有问题,一个是不能正确处理4中对象包含对象的问题(尤其是有两个元素拥有同一个父对象的时候,比如test.id=1&test.name='chua'都拥有父对象test)。另外一个就是值attributevalue中包含单引号、双引号时无法正确处理。所以使用赋值=最保险。
所以最终完整的源码如下
/*serializedparams格式为key1=value1&key2=value2. 也支持'key.sonkey=value' */function paramstring2obj (serializedparams) { var obj={}; function evalthem (str) { var strary = new array(); strary = str.split(=); //使用decodeuricomponent解析uri 组件编码 for(var i = 0; i 2){ for(var i = 2;i 以上内容是基于javascript将表单序列化类型的数据转化成对象的处理(允许对象中包含对象),希望本文分享能够给大家带来帮助。
其它类似信息

推荐信息