关于获取URL中传值的解决方法--升级版
这次页面之间的传值是升级版本，为什么是升级版本呢，因为这次页面的传值不一样了。大家可以看一下我原来的文章《关于获取URL中传值的解决方法》
其实上次就已经比较清楚的介绍了页面之间的传值，但是这次要传输的是一个数组，或者是一个JSON字符串。这次就不太一样了。首先我们来看页面index1.html,这个页面需要向index2.html中传输一个数组。而且里面还含有中文信息。先看index1.html中的内容吧：
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8" /> 5 <title>页面一</title> 6 </head> 7 <body> 8 <div>页面一</div> 9 </body> 10 <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script> 11 <script type="text/javascript"> 12 // var arr={"a":{ 13 // "id":1, 14 // "name":"标签一" 15 // },"b":{ 16 // "id":2, 17 // "name":"标签二" 18 // },"c":{ 19 // "id":3, 20 // "name":"标签三" 21 // }}; 22 var arr=[{"id":1,"name":"标签"} 23 ] 24 // console.log(arr); 25 // console.log(JSON.stringify(arr)) 26 // console.log(encodeURI(JSON.stringify(arr))) 27 // console.log(JSON.parse(decodeURI(encodeURI(JSON.stringify(arr))))); 28 $('div').click(function(){ 29 window.location.replace('./index2.html?data='+encodeURI(encodeURI(JSON.stringify(arr)))); 30 }) 31 </script> 32 </html>
这里就是最简单的点击一个按钮，然后跳转到index2.html中，我们看到这里声明的arr数组，是要传输的。我们首先是利用JSON.stringify()的方法，让他变成一个字符串，然后利用两次encodeURI()让他能在地址栏正确的传输，如果arr中不包含中文的话，其实是可以只用一次encodeURI()的。
http://192.168.18.4:8020/%E9%A1%B5%E9%9D%A2%E4%B9%8B%E9%97%B4%E7%9A%84%E4%BC%A0%E5%80%BC/index2.html?data=%255B%257B%2522id%2522:1,%2522name%2522:%2522%25E6%25A0%2587%25E7%25AD%25BE%2522%257D%255D
这就是我点击页面跳转到index2.html的时候，地址栏的显示。
再来看一下我们的index2.html页面的内容；
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <title>页面二</title> 6 </head> 7 <body> 8 <div>页面二</div> 9 </body> 10 <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script> 11 <script type="text/javascript"> 12 function geturl(name) { //获取页面之间的传值 13 var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i"); 14 var r = window.location.search.substr(1).match(reg); 15 if(r != null) return unescape(r[2]); 16 return null; 17 }; 18 var arr = geturl('data'); 19 var arr1 = JSON.parse(decodeURI(decodeURI(arr))); 20 var name = arr1[0].name; 21 console.log(decodeURI(name)) 22 console.log(arr1) 23 </script> 24 </html>
这里面的geturl（）在上个函数中已经讲解过了，主要的是我们看一下第19行，首先我们是两次decodeURI（）,然后是JSON.parse();这个时候就是我们能得到的数组了。然后就可以任意使用了。
其实这里跟上次的是差不多的，只是多了加密和格式化的，需要注意的是，加密和格式化的先后顺序，要不然是不能正确的解析这个需要传输的数组的。
