关于encodeURI() 踩的坑

情景：

列表页跳转详情页，需要把列表页的数据带到详情页直接展示，思路是在路径后面加？传参，然后再在详情页获取url的参数。

为了以防中文乱码什么的所以先试用encodeURI转码再decodeURI解码，解码之后再JSON.parse()转成obj。

列表页代码：

var param = JSON.stringify(obj.data);
var info = encodeURI(encodeURI(param))
var url = 'matter/faultReport/faultReportDetail?info='+info ;

详情页代码

var info = GetQueryString('info');
info = (function(info){return JSON.parse(decodeURI(decodeURI(info)))})(info);

/*
 * 获取地址栏参数
 */
function GetQueryString(name) {
	var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
	var r = window.location.search.substr(1).match(reg);
	if(r != null) return unescape(r[2]);
	return null;
}

　　好了，接下来就要说说我遇上的坑了，没错，详情页JSON.parse()报错了，经过我反复debugger比对，是因为在列表页的obj.data中有一个字段有&符号，而encodeURI()又不转译这个符号，导致在详情页GetQueryString()获取参数的时候数据不完整，所以无法JSON.parse()。

　　修改方法其实很简单，把encodeURI() 改成encodeURIComponent()方法就好了，这样所有符号都转译了，当然相应的decodeURL()也要改成decodeURLComponent()。

 

注：encodeURI 会替换所有的字符，但不包括以下字符，即使它们具有适当的UTF-8转义序列：

保留字符	; , / ? : @ & = + $
非转义的字符	字母 数字 - _ . ! ~ * ' ( )
数字符号	#