關於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轉義序列：

保留字符	; , / ? : @ & = + $
非轉義的字符	字母 數字 - _ . ! ~ * ' ( )
數字符號	#