js处理url中的请求参数(编码/解码)
在处理 a 链接跳转其他页面时,总会遇到需要传递一些当前页面的信息到其他页面,然后其他页面利用这些信息进行相关操作。利用 get 请求或 hash 传递是常见的方式。
首先,需要对传递的参数进行编码,保证数据的安全性;之后,将参数拼接到要跳转的url后,并设置为 a 链接中的 href 属性值。
- var util = {
- setUrlParam: function (params, targetUrl) {
- var url = '';
- if(params && targetUrl){
- // json系列化为字符串,并编码
- var enRequestParams = encodeURIComponent(JSON.stringify(params));
- // get拼接
- url = targeteUrl + '?rq=' + enRequestParams;
- // 或hash拼接
- // targeteUrl = targeteUrl + '#rq=' + enRequestParams;
- }
- return url;
- }
- }
- // 假设需要传递的数据如下
- var requestParams = {
- 'id': '1001',
- 'time': '2017-04-21'
- };
- // 要跳转的页面url
- var targeteUrl = 'http://www.baidu.com';
- // 获取html中id=target的a链接,并设置href
- var ndTargetLink = document.querySelector('a#target');
- ndTargetLink.href = util.setUrlParam(requestParams, targeteUrl);
完成了地址拼接,接下来就是在目标页面中解析请求参数了。
- var util = {
- // 获取参数
- getUrlParam:function(url, param) {
- var reg = new RegExp(param + "=([^&]*)(&|$)");
- var num = url.match(reg);
- if (num != null)
- return num[1];
- return null;
- },
- // 解码,try处理多次编码的情况
- decodeUrl:function(str){
- str=decodeURIComponent(str);
- var json=null;
- try{
- json=JSON.parse(str);
- return json;
- }catch(e){
- return util.decodeUrl(str);
- }
- }
- }
- var loadPage = {
- data:(function(){
- var json=util.decodeUrl(util.getUrlParam(hash,'rq'));
- return json;
- })()
- }
- var data = loadPage.data;
- console.log('data',data);
js处理url中的请求参数(编码/解码)的更多相关文章
- js的url中传递中文参数乱码,如何获取url中参数问题
一:Js的Url中传递中文参数乱码问题,重点:encodeURI编码,decodeURI解码: 1.传参页面Javascript代码: <script type=”text/javascript ...
- Js的Url中传递中文参数乱码的解决
一:Js的Url中传递中文参数乱码问题,重点:encodeURI编码,decodeURI解码: 1.传参页面Javascript代码: 2. 接收参数页面:test02.html 二:如何获取Url& ...
- js获取url中的中文参数出现乱码
解决方法 function getQueryString(key){ var reg = new RegExp("(^|&)"+key+"=([^&]*) ...
- 关于使用JS去除URL中的指定参数问题,js 对url进行某个参数的删除,并返回url
在网页上找了半天,发现现在的资源实在是少的可怜,而前端尤甚.所以没办法,于是自己花了一些时间写了一个: 1 /** 2 * 删除URL中的指定参数 3 * @param {*} url 4 * @pa ...
- JS获取Url中传入的参数
一:后台获取,前台调用 后台: object value= Request.QueryString[key]; 前台js: $(function(){ var value="<%=va ...
- node.js获取url中的各个参数
实例代码test.js var http=require('http'); var url=require('url'); var querystring=require('querystring') ...
- JS获取url中的指定参数
function GetRequest() { var url = location.search; //获取url中"?"符后的字串 var theRequest = new O ...
- 使用js获取url中的get参数并转成json格式
写在前面的 没啥说的 上代码 思路就是先获取到?后面的参数区,然后 利用字符串转数组方法获取到各个参数 var json = {}; var url = 'https://www.baidu.com/ ...
- javascript从url中获取请求参数
function getUrlParam(name) { var reg = new RegExp("(^|&)" + name + "=([^&]*)( ...
随机推荐
- Executor(一)ExecutorService 线程池
Executor(一)ExecutorService 线程池 本篇主要涉及到的是 java.util.concurrent 包中的 ExecutorService.ExecutorService 就是 ...
- 8个设计师必看的免费UI图标设计资源站
图标是我们日常APP及网页设计过程中必不可少的元素之一,通过小小的图标,可以快速方便的实现视觉引导和功能划分.在创作时,我们需要寻找各种各样的图标来满足自己的设计需求,非常浪费时间和精力.今天,小编给 ...
- part1:4-linux快速体验
1.Linux部分目录结构介绍 /:根目录,一般根目录下只存放目录,尽量不要存放文件:/etc./bin./dev./lib./sbin应该和根目录放置在一个分区中. /bin:可执行二进制文件目录, ...
- 为什么const对象只能调用const成员函数,而不能调用非const成员函数?
在c++中,我们可以用const来定义一个const对象,const对象是不可以调用类中的非const成员函数,这是为什么呢?下面是我总结的一些原理. 假设有一个类,名字为test代码如下: clas ...
- 20155213 2016-2017-2 《Java程序设计》第八周学习总结
20155213 2016-2017-2 <Java程序设计>第八周学习总结 教材学习内容总结 第十四章NIO与NIO2 NIO NIO使用频道来衔接数据节点,在处理数据时,NIO可以让你 ...
- hdu-1050(贪心+模拟)
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1050 思路:由图可知,1对应2,3对应4,以此类推,如果x,y是偶数则变为奇数: 每次输入两个区间,找 ...
- [转载][翻译]Go的50坑:新Golang开发者要注意的陷阱、技巧和常见错误[2]
Golang作为一个略古怪而新的语言,有自己一套特色和哲学.从其他语言转来的开发者在刚接触到的时候往往大吃苦头,我也不例外.这篇文章很细致地介绍了Golang的一些常见坑点,读完全篇中枪好多次.故将其 ...
- UVa 1572 Self-Assembly (构造+拓扑排序。。。。。)
题意:给定n个带标号的正方形,标号要么是一个大写字母加一个+或-,要么是00, 当且仅当大写字母相同并且符号相反时可以连接,问你给定的能不能拼成一个无限大的的东西. 析:说实话,真心没有看出来是拓扑排 ...
- VHDL的库
STD_LOGIC_ARITH 扩展了UNSIGNED.SIGNED.SMALL_INT(短整型)三个数据类型,并定义了相关的算术运算和转换函数. --======================== ...
- python-optparse模块给脚本增加参数选项
import optparse parser = optparse.OptionParser('[-] Usage %prog '+ '-H <RHOST[s]> -l [-p -F ]' ...