这次页面之间的传值是升级版本，为什么是升级版本呢，因为这次页面的传值不一样了。大家可以看一下我原来的文章《关于获取URL中传值的解决方法》

　　其实上次就已经比较清楚的介绍了页面之间的传值，但是这次要传输的是一个数组，或者是一个JSON字符串。这次就不太一样了。首先我们来看页面index1.html,这个页面需要向index2.html中传输一个数组。而且里面还含有中文信息。先看index1.html中的内容吧：

 <!DOCTYPE html>

 <html>

     <head>

         <meta charset="utf-8" />

         <title>页面一</title>

     </head>

     <body>

         <div>页面一</div>

     </body>

     <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>

     <script type="text/javascript">

 //        var arr={"a":{

 //            "id":1,

 //            "name":"标签一"

 //        },"b":{

 //            "id":2,

 //            "name":"标签二"

 //        },"c":{

 //            "id":3,

 //            "name":"标签三"

 //        }};

 var arr=[{"id":1,"name":"标签"}

 ]

 //        console.log(arr);

 //        console.log(JSON.stringify(arr))

 //        console.log(encodeURI(JSON.stringify(arr)))

 //        console.log(JSON.parse(decodeURI(encodeURI(JSON.stringify(arr)))));

         $('div').click(function(){

             window.location.replace('./index2.html?data='+encodeURI(encodeURI(JSON.stringify(arr))));

         })

     </script>

 </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页面的内容；

 <!DOCTYPE html>

 <html>

     <head>

         <meta charset="UTF-8">

         <title>页面二</title>

     </head>

     <body>

         <div>页面二</div>

     </body>

     <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>

     <script type="text/javascript">

         function geturl(name) { //获取页面之间的传值

             var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");

             var r = window.location.search.substr(1).match(reg);

             if(r != null) return unescape(r[2]);

             return null;

         };

         var arr = geturl('data');

         var arr1 = JSON.parse(decodeURI(decodeURI(arr)));

         var name = arr1[0].name;

         console.log(decodeURI(name))

         console.log(arr1)

     </script>

 </html>

这里面的geturl（）在上个函数中已经讲解过了，主要的是我们看一下第19行，首先我们是两次decodeURI（）,然后是JSON.parse();这个时候就是我们能得到的数组了。然后就可以任意使用了。

　　其实这里跟上次的是差不多的，只是多了加密和格式化的，需要注意的是，加密和格式化的先后顺序，要不然是不能正确的解析这个需要传输的数组的。

关于获取URL中传值的解决方法--升级版的更多相关文章

  1. 关于获取URL中传值的解决方法

    在我们页面的URL中包含着很多信息,包括域名,协议等等这里就不一一介绍了),对于我们开发者而言,使用比较多的就是页面之间的传值.为什么要页面传值呢?很简单,当你在浏览一个商品页面的时候你要看到一个商品 ...

  2. tomcat下获取当前路径的url中含有空格解决方法

    参考博文(http://www.360doc.com/content/11/1009/17/4602013_154657565.shtml) web项目发布到Tomcat之后,如果tomcat是安装在 ...

  3. js获取url中的参数(解决中文乱码)

    这个是封装好的方法: function getQueryString(name) { var reg = new RegExp("(^|&)" + name + " ...

  4. javascript获取url中对应参数的方法

    利用正则表达式和location.search方法,可以简便的获取到对应的参数:   function getQueryString(name) {var reg = new RegExp(" ...

  5. iOS 的url中含有中文解决方法

    [NSURLURLWithString:urlString]生成URL对象时,iOS客户端不能正确进行网络请求,网上找到的URLEncode方法又不能完全解决问题. 方法1: NSString* en ...

  6. js获取url中的参数,并保证获取到的参数不乱码

    //网上比较经典的js获取url中的参数的方法 function getQueryString(name) { var reg = new RegExp("(^|&)" + ...

  7. APPCAN开发笔记：html页面之间的参数传递：使用js获取url中的参数，以及在APPCAN中不能使用的解决方法

    用PHP的GET/POST方式来传递方式已经是司空见惯了,但是如果我的页面是一个静态的html的页面,想传递参数的时候要怎么办呢?在APPCAN的开发中我们会经常遇到这样的问题,因为所有的页面都是静态 ...

  8. 记录一次bug解决过程：velocity中获取url中的参数

    一.总结 在Webx的Velocity中获取url中参数:$rundata.getRequest().getParameter('userId') 在Webx项目中,防止CSRF攻击(Cross-si ...

  9. JS获取URL中参数值（QueryString）的4种方法分享<转>

    方法一:正则法 复制代码代码如下: function getQueryString(name) {    var reg = new RegExp('(^|&)' + name + '=([^ ...

随机推荐

  1. 简单又实用的分享！SharePoint母版页引用（实战）

    分享人:广州华软 极简 一. 前言 此SharePoint 版本为2013,请注意版本号.此文以图文形式,描述了根网站及子网站引用母版页,需要注意的点已用图文形式以标明. 本文适用于初学者. 二. 目 ...

  2. .net core 在网络高并发下提高JSON的处理效率

    现有的webapi一般都基于JSON的格式来处理数据,由于JSON是一个文本类的序列化协议所以在性能上自然就相对低效一些.在.net中常用Newtonsoft.Json是最常用的组件,由于提供简便基于 ...

  3. 一段简单的显示当前页面FPS的代码

    写前端代码,尤其是做一个前端框架的时候,经常需要及时知道代码的大致性能,这时候如果能有个好的办法能一直看到当前页面的fps就好了. 整体思路是一秒有一千毫秒,先记录当前时间作为最后一次记录fps的时间 ...

  4. bash语法

    国际惯例打印hello world   echo "hello world"   该程序运行结果: hello world 1.变量:   a=;b="hello wor ...

  5. 关于ES5的indexof()和ES7的includes()的区别

    早es5的时候就有了查找数组中是否包含某个值的API  indexOf(); 使用方法很简单,比如有个数组是: var arr=[2,3,4,"php"] 如果我们想知道数组中有没 ...

  6. 8天入门docker系列 —— 第二天 通过一个aspnetcore程序加深对容器的理解

    我们知道容器是一个打包了应用和相关依赖的盒子,那怎么去操控这个盒子呢? 这一篇我通过一个简单的aspnetcore程序来加深对盒子的理解,使用之前先 安装一下Docker的环境. 一:Docker的安 ...

  7. JenKins使用pm2部署.net core网站

    登录事先准备好的 Jenkins 1 新建任务 2 源码管理 git 输入正确地址 3 构建环境:Delete workspace before build startsAbort the build ...

  8. 【MQ】消息队列及常见MQ比较

    一.什么是消息队列 我们可以把消息队列比作是一个存放消息的容器,当我们需要使用消息的时候可以取出消息供自己使用.消息队列是分布式系统中重要的组件,使用消息队列主要是为了通过异步处理提高系统性能和削峰. ...

  9. 一起学Android之Menu

    概述 菜单(Menu)在Android开发中,是一种常见的用户界面组件,通过使用菜单Api可以给用户提供常见的一致的体验.本文主要讲解三种菜单的相关内容. 菜单的分类 选项菜单(OptionsMenu ...

  10. 【Matlab&Mathematica】对三维空间上的点进行椭圆拟合

    问题是这样:比如有一个地心惯性系的轨道,然后从轨道上取了几个点,问能不能根据这几个点把轨道还原了? 当然,如果知道轨道这几个点的速度的情况下,根据轨道六根数也是能计算轨道的,不过真近点角是随时间变动的 ...