将jquery序列化转成对象的编码坑

Posted 2020-07-01

主要的两个坑：

1. 　jquery的 serialize()时会将空格转义成+，字符转成对象时把+号转成空格

　　　　例如：

<input type="text" value="12 34+56" />

　　　　那么在执行 serialize()方法后，得到的却是  12+34%2B56  这样的字符串；
　　　　即jquery的序列化方法对空格进行了转义，转换成了 + 号，“+”号转义的是 ％２Ｂ

　　2.　一直以为序列化字符串中key编码没啥用，key一定要编码，若key不编码如下情况会出现问题

　　　　

<input type="text" name="goodsList[0].storeNum"   />

 

最终将jquery序列化字符串转成对象的方法如下

 1 serializeObj: function(paramStrs){
 2             if(!paramStrs){
 3                 return {};
 4             }
 5 
 6 　　　　　　　// jquery序列化传入的字符串，将+号转成空格
 7             paramStrs = paramStrs.replace(/\+/gi, ‘ ‘);
 8 
 9             var arr = paramStrs.split(‘&‘),
10                 returnObj = {},
11                 name = ‘‘,
12                 value = ‘‘,
13                 temp = null;
14             for(var i=0; i< arr.length; i++){
15                 temp = arr[i].split(‘=‘);
16                 name = decodeURIComponent(temp[0]);
17                 value = decodeURIComponent(temp[1]);
18 
19                 if(!returnObj.hasOwnProperty(name)){
20                     returnObj[name] = value;
21                 }else{
22                     if($.isArray(returnObj[name])){
23                         returnObj[name].push(value);
24                     }else{
25                         var tempArr = [returnObj[name]];
26                         tempArr.push(value);
27                         returnObj[name] = tempArr;
28                     }
29                 }
30             }
31 
32             return returnObj;
33         }